Misko Hevery explains why Qwik will improve JavaScript frameworks – The New Stack

A new JavaScript technique or library seems to make its rounds in the developer community every week. The need for most of them is debatable, but Builder.io CTO Misko Hevery says his new project addresses a long-standing issue. Qwik is a DOM-centric JavaScript framework designed to make “Instant Apps” possible, focusing on “the ability to resume server-side rendering of HTML and late-loading lazy code.”

Hevery is best known for being the creator of Angular, the influential JavaScript framework released by Google in 2010 (then known as AngularJS). So if you make a list of people who could fix the state of JavaScript frameworks, Hevery would be at the top of that list.

He first talked about the applications that can be resumed during the 2019 Angular Ng-Conf. During this presentation, he gave two rules about what a framework should do to create apps that start instantly: only download and run the code strictly necessary to handle user interaction, and not duplicate work that the server has already done.

It is from these ideals that Qwik was created. “Executives set the rules of the game and developers have to follow them,” Hevery said in an interview with The New Stack. “Because the current framework rules are hydration to make the site interactive, all complex sites are slow to start. To get out of this trap, you need a resumable framework rather than hydration.

The Benefits of Server-Side Rendering

In January 2021, Qwik began development, starting with a project where Hevery was “mostly playing with how far I could push the idea of ​​delaying code execution on the client”. He says the original syntax lacked the tooling and therefore left a lot to be desired. Yet learning on the job has paid off.

“When I joined Builder.io in June 2022,” he said, “it became a full-time effort, and I was joined by Adam Bradly and Manu Martinez-Almeida to work there full time. It turns out that between the three of us, we have a lot of experience building frameworks, so we had a clear idea of ​​what we wanted Qwik to be.

To better understand the appeal of Qwik, Hevery describes how it stands out from other frameworks. “Current frameworks are only interested in client rendering. RSS [server-side rendering] really is an afterthought. As a result, client hydration is the only way to make an app work, and hydration is expensive and results in slow app startups.

He continued, “By taking care of the whole problem end-to-end, SSR is not an afterthought, but a central goal of Qwik. The result is much better website startup performance. Qwik can serve most sites without JavaScript, then download only the code needed to process a specific user interaction.”

For example, when navigating to a product page on Amazon, you will come across many parts of the site. Cart, notes, product details, menu, etc. all need to be charged. But, as Hevery notes, “as a user, you don’t need all of these pieces at once.”

“It would be expensive to delay the first interaction until all the code is downloaded and executed, but that’s what hydration does,” he continued. “Instead, Qwik sends pure HTML – and a small polyfill of about 1 KB – to the client. If the user clicks Add to Cart, only the code to add the item to the cart and put The shopping cart component is downloaded and executed, making the amount of JavaScript on the browser lightweight, no matter how complex the overall application.

Refined lazy loading

Qwik offers “fine-grained” lazy loading, which refers to how Qwik breaks applications into smaller chunks and gives servers the freedom to decide which large chunks of code should be sent to the client and when.

“With current frameworks, lazy loading is the responsibility of the developer,” Hevery said. “In Qwik, lazy-loading falls on the framework. Every callback (effect, listener, render function) is lazy-loadable. This fine-grain nature, along with the ability to render components independently, gives Qwik the power to not download of code if the code is not strictly necessary.

Hevery went on to explain that Qwik’s closest tech is actually a go-to for Google (where he worked from 2005-2021). “Internally, Google has a framework called Wiz that powers Google Search, Photos, and Gmail, among other things. Wiz has instant properties for the app, and depending on how you look at it, you can tell it Strictly speaking, there is no server execution of JavaScript being interrupted in Wiz, so there is no “resuming” taking place, but the effect is the same. has an open source part called jsaction which, as far as I know, pioneered the idea of ​​serializing listeners to HTML. Qwik’s listener serialization is very similar to jsaction’s.”

Hevery said Qwik is very different from Wiz in its core and in its implementation and syntax, but the goal is the same: apps that start instantly.

What’s next for Qwik?

Qwik is currently available on Builder.io’s GitHub. Hevery adds that the project is getting closer to general availability. “We are quite confident in Qwik, but want to have a complete solution before declaring it. For this reason, we are also working on Qwik City, a meta-framework for Qwik that allows us to build websites with location-based routing. Additionally, we are working on Qwikify React, which allows migration from Qwik sites and allows Qwik to use libraries from the React ecosystem, such as Material Components.

Hevery says Qwik gives developers a new approach to building web apps. “Lazy loading and fine-grained resume capability results in instant applications and SEO solutions from the get-go,” he promises.

The New Stack is a wholly owned subsidiary of Insight Partners, an investor in the following companies mentioned in this article: Wiz.

Comments are closed.