6

Are the technical concepts of Angular Elements and Stencil similar?

Angular Elements will be a new feature in Angular 6, where u can basically wrap your written Angular component as a Web Component. In my understanding the generated Custom Element is just a bridge to Angular, so we still have to ship Angular.

Stencil, on the other side, claims to be a compiler that generates Web Components. So the generated Custom Element is not just a bridge to something?

Did i get that right?

ChrisY
  • 1,681
  • 10
  • 12
  • i see very interesting talk : https://www.youtube.com/watch?v=ljsOPm4MMEo about this topic, question is pretty interesting. – Yanis-git Apr 20 '18 at 10:36
  • According to what i have seen here : https://nitayneeman.com/posts/building-a-custom-element-using-angular-elements/ you have Right, is clearly en embed and packaged version on angular, without bootstrapping step. This looks like bridge between Angular and reste of the world. About Stencil, i have no more information. – Yanis-git Apr 20 '18 at 12:18
  • Guess I'll have to take a deeper look into Stencil ;) – ChrisY Apr 21 '18 at 12:00
  • Yeah me too, by your question i have discover this new way to develop. – Yanis-git Apr 21 '18 at 14:43

3 Answers3

6

You shouldn't have to ship Angular as you put it. Angular Elements will allow us to use Angular components without the whole Angular Ecosystem. So if you had a React app or a VueJS app, you could take your Angular Element (thanks to Custom Element) and just plop it into those apps.

Rob Wormald did a cool talk about them with all the deets at ng-conf this year. I'd check that out for the latest info.

AlyssaNicoll
  • 141
  • 9
  • You are right. We don't need to ship the **whole** Angular Ecosystem thx to AOT and Treeshaking. But when we want to use DI we have to ship something. Please don't get me wrong. I don't wanna criticize Angular. In fact I'm a huge Angular fan and Rob does great work. I was just curious and wondered how the technical concepts of StencilJs are compared to it. – ChrisY Apr 27 '18 at 04:18
1

yes you are right, stencil is just a compiler to generate Standard Web Components so you are able to use your web components (built with stencil) everywhere.

You can generate a web component and then use it in your Angular or React or Vue App, just load it and drop the tag and will work.

Fernando Del Olmo
  • 1,440
  • 17
  • 32
0

Yes and no.

Technical concepts are very similar.Both make use of the custom element spec Angular is also reusable and independent just link stencil. And can be used everywhere. Comparatively Stencil is better according to me . It has lazy loading feature inbuilt. The build package size is lesser than angular. And works better when shadow dom is activated in all browsers. Angular still requires poly fills to run in some browsers. And slow in loading.