7 ms·

My biggest issue with AngularJS is the inflexibility of it to play nice with existing '1.0' sites. Almost all the sites I'll develop take advantage of progress

by TeamMCS 13y ago

My biggest issue with AngularJS is the inflexibility of it to play nice with existing '1.0' sites. Almost all the sites I'll develop take advantage of progressively enhanced components or at minimum, widgets that are bootstrapped server side. Angular wants you to load everything via AJAX - that can get heavy very quickly. This is also evident within the codebase. You find yourself dancing around DRY violations as you pass models to your markup rendered server side and also serve the same/similar content to Angular via JSON. Now this aside, Angular wouldn't require much work to let it play an enhancement or migration role. You can already see Google have implement their own 'private' method on the homepage of Angular. Another problem that grates me about Angular is dynamic routing and loading additional Javascript on the fly. I was recently building a portlet based site. The intention was to make each module entirely configurable by other developers - that meant passing control to their controllers and allow them to enhance routing. As it stands you have to do it declaratively or using some nasty hacks.

avolcano 13y ago
> Almost all the sites I'll develop take advantage of progressively enhanced components or at minimum, widgets that are bootstrapped server side. Angular wants you to load everything via AJAX - that can get heavy very quickly. I'm surprised that I haven't seen a library for any JavaScript framework that elegantly handles loading JSON returned within a server-side template. It seems like the best of both worlds - use your server-side template, but then also get the data as JSON so that you don't have to do a second request to populate your Angular $scope with data. The easy way to implement this would be a library that automatically added <script> tags containing the JSON that you could then reference from your Angular template. It could even wrap the JSON in an Angular module of some sort to keep your global namespace from being polluted.
- SanderMak 13y ago
  Agreed. I tried to explore this issue a while back: http://branchandbound.net/blog/web/2012/11/unify-server-side-client-side-rendering-embedding-json/ http://branchandbound.net/blog/web/2012/11/unify-server-side... Turns out that using script-tags is somewhat problematic, but as a comment points out, data-attributes could work.
  - esailija 13y ago
    This is not a problem in e.g. PHP, out of the box it can embed json in script tags, with default settings you never get the sequence `</script>` (you get `<\/script>` instead) and it even escapes U+2028` and U+2029 which are syntax errors in Javascript string literals but not in JSON.
- conradfr 13y ago
  On initial page load I usually put json in a global javascript variable and retrieve it in Angular. Maybe you can do something cleaner with module.value() ?
  - goblin89 13y ago
    > Maybe you can do something cleaner with module.value() ? I do a simple thing like that for certain settings[0]. I imagine this could easily be done for bootstrapped model data as well. [0] https://gist.github.com/strogonoff/6159373 https://gist.github.com/strogonoff/6159373
greaterweb 13y ago
A little confused here. So you have components server side that need to be in your application. Are they a functional part of the Angular app or just "static" markup that is complimentary to the dynamic pieces? Worth noting is that unlike other front end frameworks, Angular allows you to have one (or more) elements within a page dedicated as the application container, you don't need the entire page for that. Front end frameworks such as Angular are certainly geared towards service oriented application development. If that doesn't make sense for your project or architecture, well, square peg round hole situation :-)
weavie 13y ago
Rendr (https://github.com/airbnb/rendr https://github.com/airbnb/rendr) tries to get around this with Backbone.

by TeamMCS 13y ago

avolcano 13y ago

> Almost all the sites I'll develop take advantage of progressively enhanced components or at minimum, widgets that are bootstrapped server side. Angular wants you to load everything via AJAX - that can get heavy very quickly. I'm surprised that I haven't seen a library for any JavaScript framework that elegantly handles loading JSON returned within a server-side template. It seems like the best of both worlds - use your server-side template, but then also get the data as JSON so that you don't have to do a second request to populate your Angular $scope with data. The easy way to implement this would be a library that automatically added <script> tags containing the JSON that you could then reference from your Angular template. It could even wrap the JSON in an Angular module of some sort to keep your global namespace from being polluted.

SanderMak 13y ago
Agreed. I tried to explore this issue a while back: http://branchandbound.net/blog/web/2012/11/unify-server-side-client-side-rendering-embedding-json/ http://branchandbound.net/blog/web/2012/11/unify-server-side... Turns out that using script-tags is somewhat problematic, but as a comment points out, data-attributes could work.
- esailija 13y ago
  This is not a problem in e.g. PHP, out of the box it can embed json in script tags, with default settings you never get the sequence `</script>` (you get `<\/script>` instead) and it even escapes U+2028` and U+2029 which are syntax errors in Javascript string literals but not in JSON.
conradfr 13y ago
On initial page load I usually put json in a global javascript variable and retrieve it in Angular. Maybe you can do something cleaner with module.value() ?
- goblin89 13y ago
  > Maybe you can do something cleaner with module.value() ? I do a simple thing like that for certain settings[0]. I imagine this could easily be done for bootstrapped model data as well. [0] https://gist.github.com/strogonoff/6159373 https://gist.github.com/strogonoff/6159373

greaterweb 13y ago

A little confused here. So you have components server side that need to be in your application. Are they a functional part of the Angular app or just "static" markup that is complimentary to the dynamic pieces? Worth noting is that unlike other front end frameworks, Angular allows you to have one (or more) elements within a page dedicated as the application container, you don't need the entire page for that. Front end frameworks such as Angular are certainly geared towards service oriented application development. If that doesn't make sense for your project or architecture, well, square peg round hole situation :-)

weavie 13y ago

Rendr (https://github.com/airbnb/rendr https://github.com/airbnb/rendr) tries to get around this with Backbone.