Replacing angular with standard web technologies Replacing angular with standard web technologies angularjs angularjs

Replacing angular with standard web technologies


I've been researching in the past 3 weeks and turns out many people are thinking about an alternative after Angular took a drastic change path. Fortunately the upcomming W3C Web Components standard actually has all we need and it works right now with polyfills from the Polymer project. So to answer the question:

  • Angular Directives --> Web Components use the polyfill until all browsers support it.
  • Angular Modules --> ECMA 6 Modules part of the problem is solved with HTML imports. But you can also use Traceur until the browsers support it.
  • Angular Routes --> There's a component for that™ use <app-router>.
  • Angular 2-way databinding --> Polymer adds a "magic" layer on top of the plain standard web components. This includes many features including data-binding.

+Plus More

If you're wondering about the build process for concatenating files in order to reduce the number of HTTP requests, take a look at Addy Osmani's post about Vulcanize. Spoiler: you may not need it with the upcoming HTTP 2 optimizations.

Many Angular projects use Twitter Bootstrap for the layout. Polymer can do that plus it plays nicely with Google's Paper elements (totally optional but superbly awesome).

If you want to make yourself familiar with web components in general, here is a bunch of nice articles: http://webcomponents.org/articles/

And here is a wealth of web components: http://customelements.io/ I don't know if it's going to be a new NPM, but the list components is pretty impressive and growing.

It's relatively complicated to expose an API for an Angular component. People have come up with all sorts of methods from link function to emitting events. In Web Components, however, it's really easy to make your component interact with the world outside and indeed the API and events you expose aren't much different from standard HTML tags like <audio>.

Just like Angular, you can use Polymer with Dart as well.

Conclusion

Overall, I don't see any reason to use Angular except if:

  1. You have a huge source code investment in angular and don't want to port everything to standard web. (Angular 2.0 will deprecate your code anyway, so you're stuck with Angular 1.*)
  2. Your team is too lazy to learn a new technology (in that case web might not be the right platform for this attitude anyway).

Angular was good for what it was doing and had its own Hype cycle. Web components solve many of the issues Angular was trying to address. Probably Angular had a role as a proof of concept for the Web components. But now it's time to move on. Web is reinventing itself everyday and it's inevitable to moves someone's cheese.

I'm not saying that Polymer is the ultimate answer to everything. At best it's another Angular which will render useless in a couple of years, but now it's a good time to learn and use it. The W3C standards don't die easily though, and Polymer tends to be much closer to them.

RIP Angular 2009-2014

There's an element for that™ is the new There's an app for that™


TLDR: seriously consider writing an almost Angular 2.0-compatable Angular 1.3 app before rolling your own framework

It seems as if you've identified that Angular does a lot of things the right way and that's why you're attempting to replicate it, so basically you're going to roll your own by combining a hodgepodge of libraries. Unless you have an enormous investment of Engineering hours, the framework you build will likely be:

  • Lightly documented
  • A cross-browser maintenance nightmare and (worst of all)
  • Difficult for new hires to learn

If there wasn't a framework out there that did what you want to do already, I think rolling your own makes sense, but by trying to recreate Angular you're:

  • Taking on a lot of Engineering work that has already been done by a dedicated team, that could have been spent on building product
  • Made it MUCH more difficult to onboard new employees because you have to:
    • Find candidates that are willing to use a home-grown framework instead of growing their skills at an open source framework they could use elsewhere
    • Train these employees to use your framework (and good luck unless your documentation is mature)

I know your question asks how to replace Angular, but I've seen too many companies go the route of rolling their own and paying for it down the road. Again, if your budget includes a ton of core resources to build out (and document, and maintain) the framework and you don't think there is any chance corners will get cut when push comes to shove later if timelines get tight, then rolling your own might make sense. However, I think you should seriously consider reading up on how to write Angular 1.3 apps so that they're easy to port to Angular 2.0 and go the Angular route. Just look at the size of the community you're missing out on:
http://www.airpair.com/js/javascript-framework-comparison