Friday, June 20, 2014

Streamlining the mobile-app development process in the large team scenario

Every time a file gets added to the project, it adds-up an extra latency in the file loading. So minimizing the number of files in the release-build would definitely enhance the performance of the app. Considering this fact, we should have only one stylesheet containing all the styles related to the app.

Though putting everything (style class) in single file would definitely have the following effects
  • Pros: It would make it 
    • compact, 
    • easy to load, 
    • one-time loading 
  • Cons: It would make it 
    • lengthy for manual readability;

Thus we need to make it modular, that means, a separate stylesheet need to be made for each module; which is easy to modify & debug for developers. Each stylesheet should follow the standard guidelines like
  • adding a module-name prior to the style class name, 
  • avoiding id based style class, etc.

To enforce the developers to follow the standard guidelines, we can also use a css generator system. Where developers have to fill up the cells in the sheet/form after which the standard css file gets generated out of it. In our system it would be the css for particular module.

Prior publishing the release-build,
  • we can run a script that can concatenate all the stylesheets into single stylesheet; 
  • this script can compress the file as well if required;
  • the index.html file will be having the link of this single stylesheet only.

Similarly, since we have a definite set of unique screens, so there should be only one html file in the project (aka single-page app). Thus, we can have following benefits:
  • It would reduce the transition time to zero during html page change. 
  • Developers can work on this html file along with that single css file on their desktop browsers like chrome. 
  • Since the Chrome browser comes up with advance debugging tools for developers, so the design and alignment related issues can be resolved in very less time in comparison to using Android IDE. 
  • We can further reduce the JavaScript’s part of html code creation/rendering by adding the html templates in the index.html page only. 
  • The JavaScript only have to deal with logic, control and flow.

This would separate the markup, style and script into separate files without hindering in each other’s zone. So by this we have separated the layout, design and logic into separate divisions. Though the script (logic division) can be further handled with standard MVC frameworks. That would make the project much more simplified and manageable.

No comments:

Post a Comment