ionic-team / stencil

A toolchain for building scalable, enterprise-ready component systems on top of TypeScript and Web Component standards. Stencil components can be distributed natively to React, Angular, Vue, and traditional web developers from a single, framework-agnostic codebase.
https://stenciljs.com
Other
12.56k stars 787 forks source link

Move towards plain classes with constructor properties and component functions #768

Closed rschoenbichler closed 6 years ago

rschoenbichler commented 6 years ago

Stencil version:

 @stencil/core@0.7.27-4

I'm submitting a:

[ ] bug report [x ] feature request [ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or https://stencil-worldwide.slack.com

Current behavior:

Currently, stencil components are build on top of classes and heavily use decorators to express dependencies and expose apis. I.e. stencil components rely on @Prop() annotations on their members in order to be exposed. This mitigates the use of common practices when implementing components like composition. I.e. it is not possible to wrap a stencil component into a high order component as props are not exposed the constructor or render function. Also, considering the state of typescript decorators and the accompanied type safety, I think this leads to bad developer experience.

Expected behavior:

Stencil components could be plain functions of props, or simple classes defining their properties in the constructor, similar to the current react api. Decorators, like Component, could still be applied on the function/class to maintain the separation of concern at this point. Composition, (which the Component decorator is) could easily be applied while maintaining type safety.

Other information:

I'm really interested in how you see those ideas and what your opinion is on this topic. I think stencil is definitely the right direction to go, and it would benefit from a more functional approach.

adamdbradley commented 6 years ago

The compiled output of the typescript classes is only an ES2015 class with static properties. So at the core of stencil it does only use classes and static properties. However, at this stage of the project we have found typescript to be very useful for developer experience so we'll probably stick with typescript for now. One thing we could look into is still allowing the components to be build without typescript, since again the core runtime has nothing to do with typescript. Hope that helps answer the question, thanks.