I am looking into Ember.js as a framework for redesign/rework of a large scale website/application at my company. I would love to turn the website into a Single Page Web Application and I think that Ember would be great fit for us. I really love the Convention over Configuration because it would make our life easier for managing things down the road and it would provide consistency with a lot of developers working on this application.
I have been messing around with Ember and Ember-cli by reworking the TodoMVC tutorial for Ember-cli and HTMLbars, adding a bunch of unit tests and additional plugins for Ember-cli and I think that I am getting a handle on how things work (at least to some extent!). However, I have some concerns regarding converting ~300 pages/views, handling localization and permissions for the currently logged in login. I am not sure what the best practices to handle all this would be.
Here are my thoughts/options as I see this:
1. Load up templates and translations through ajax
- Load up templates via ajax, compile them on the fly in the browser and cache it
- Load up translations for the view through ajax and cache it
- Align everything together so that everything shows up correctly
- Smaller app load up size
- Do not need to put all translations into one file
- Localized texts could be included in the template directly as the server knows what language it needs to generate it in
- Template could be optimized based on logged in login permissions - for example do not even include the edit button in the template if the login does not have permissions for that
- Webservices would only have to serve the actual data and not permission based properties
- Things might be slower as the user is using the web app; on top of having to retrieve data we would have to retrieve both the template and the translations
- Compiling templates in the browser is a bit scary as I assume it would really lower performance if some page/view has multiple templates
- Need to load up a template and translations (to be used by the client side) separately
- Need for some kind of automated resolver that would load up the necessary templates and translations automatically for each page/view
2. Pre-generate templates with placeholders for translations; pre-generate all translations
- Have templates be in their own .hbs files and let Ember-cli compile them all together
- Pre-generate all translations into separate js files, per language, have Ember-cli include them in the project file
- Webservices would have to send not only data, but also whether logged in login has permission to edit the dataset
- Simpler to build, no server side generation necessary
- Faster once the app loads up
- No need for special resolver that would load up the templates and translations via ajax
- Large translation file
- Need to handle all permissions and different options in the templates on client side
- Need to be able to associate translations correctly with the templates (for pages/views)
As I am just starting with Ember, I am not sure what the best solution to these problems is. I was not able to find any good documentation or examples on this, mostly because of the rapid development of Ember, but also due to the fact that each application has different requirements.
Thanks for all your help!