A Look at Compilation in JavaScript Frameworks

1

Vue.js

We are just scratching the surface of compiled JavaScript frameworks, but the techniques that we associate with pure compiled frameworks are working their way into others. For example, Vue has been exploring new data-level language in their Single File Components. And it is easy since the groundwork is already there.

#Front-End Frameworks #Javascript UI Libraries #JS Library 341 social mentions

2

Svelte

With non-VDOM libraries, like Svelte or Solid, we can further optimize for updates as well since the framework is not built on a diff engine. We can use the statically known information like attributes and directly associate template expressions with them, without necessarily understanding much about those expressions. This is basically loop unwinding. Instead of iterating over a list of unknown properties we compile in the inline update expressions. You can think of it like:.

#Javascript UI Libraries #JavaScript Framework #JS Library 352 social mentions

3

React

Both of these approaches use specific syntax to denote understanding the nature of their state. Their data has become part of their language. While not enforced, have you ever wondered about the potential value of the use prefix on React hooks?

#Javascript UI Libraries #JS Library #JavaScript Framework 775 social mentions

4

Marko

Ones where end user code is run through a compiler to produce the final output. To be fair this might be a bit too loose but I want to show that the approach is a spectrum rather than a single target. The term most often gets associated with frameworks like Svelte or Marko where everything ends up getting processed. But almost all popular frameworks use some form of ahead of time(AOT) compilation on their templates.

#Javascript UI Libraries #JavaScript Framework #JavaScript 29 social mentions

5

Inferno

A VDOM library like Inferno uses this information to compile its JSX directly into pre-optimized node structures. Marko, and Vue hoist their static VDOM nodes outside of their components so that they don't incur the overhead of recreating them on every render.

#Javascript UI Libraries #JavaScript Framework #JavaScript UI Framework 2 social mentions

6

Imba

But there are more steps still to go on this path. This trend of UI Framework in JavaScript being a language goes back much further. Elm(2012), Marko(2014), and Imba(2015) are just handful. But fast-forward to 2021 and we have many more libraries in this space.

#Personal Finance #Financial Planner #Android 36 social mentions

7

Elm

But there are more steps still to go on this path. This trend of UI Framework in JavaScript being a language goes back much further. Elm(2012), Marko(2014), and Imba(2015) are just handful. But fast-forward to 2021 and we have many more libraries in this space.

#Programming Language #OOP #Generic Programming Language 114 social mentions