5 ms·
>> Use template literals for templating, so you don't even need handlebars/mustache anymore. You can do better than template literals. You can use TSX, which g
by interlocutor 8y ago
>> Use template literals for templating, so you don't even need handlebars/mustache anymore.
You can do better than template literals. You can use TSX, which gives you compile-time verification for tags and attributes, in addition to JavaScript expressions.
See: https://github.com/wisercoder/uibuilder https://github.com/wisercoder/uibuilder
With TSX (which is JSX written using TypeScript, you get things like syntax coloring and indentation for tags, because HTML and JavaScript are both first-class citizens in TSX.
- anothergoogler 8y agoIf I read parent's comment correctly, the notable thing was simplicity via few dependencies. I expect parent knows about J/TSX.
- nojvek 8y agoPanel can use any hyperscript based templating language. Virtual-jade, tsx, jsx, just h() calls. It’s pretty flexible and thin.
- anothergoogler 8y agoNever heard of hyperscript before today, thanks for the pointer.
- _sdegutis 8y agoI’ve only been using React for a few weeks but the comparisons on that page to React are FUD and the incompatibility with web components is just plain wrong and mixing them is covered here https://reactjs.org/docs/web-components.html https://reactjs.org/docs/web-components.html
- petilon 8y agoFrom the page you linked: "Events emitted by a Web Component may not properly propagate through a React render tree." React components are brittle, that's not FUD. For example, CSS classes used by React components can clash with other React components, or with the page that includes them. What's FUD about that?
- TomMarius 8y agoThat's misunderstandong of the technology. React has nothing to do with styles, it manipulates DOM. Handling styles is up to you, and it's extremely easy to use CSS modules.
- krishanath 8y ago>> React has nothing to do with styles That's one of its limitations. React is a component technology and doesn't solve the problem of clashing styles, element ids and so on. Web components is a component technology that does.
- TomMarius 8y agoNo, it's not a limitation, it's called separation of concerns, I don't want my component framework interfering with the job of Webpack or application runtime. I want to use my preferred (also easy, standard, ...) solution. > clashing IDs React solves that one, not through namespacing though. You never need to use IDs with React. > clashing styles React gives you power to solve this one by your preferred solution. You can use expressions in your JSX, and thus it's very easy to do one of the following: - Generate optimal global CSS stylesheet with no code repetition, generate classnames on the fly (https://github.com/typestyle/typestyle https://github.com/typestyle/typestyle) - Import your CSS file as a module using Webpack - classnames are guaranteed to be unique; additionally, similar approach as TypeStyle (global optimal stylesheet) can be set up - Use just "inline" styles (preferably not really inlined in your JSX) since React will keep it updated for you as well
- _sdegutis 8y agoStyled-Components gives you efficiently “inlined” styles (creates unique CSS class used only by instances of your component) and doesn’t affect global CSS. It’s up to the developer to avoid polluting with global CSS and that’s honestly not very difficult.
- anthonybullard 8y ago
- porker 8y agoAccording to https://custom-elements-everywhere.com/ https://custom-elements-everywhere.com/ React has a way to go for full support.