Prediction from the co-founder of NPM: This is the future of front-end

Hello everyone, I'm Casson.

At WWC22 , NPM co-founder (currently a data analyst at Netlify ) Laurie Voss gave a prediction speech on the future direction of web development .

In this article, let's take a look at what insights this data web with 26 years of development experience will bring.

Welcome to join the human high-quality front-end framework group , with flying

There is nothing new under the sun

How web development will develop in the next 5 years, Laurie said before giving his prediction:
All of you, probably hate my predictions .

Because he didn't want to see this prediction.

So what is his prediction based on? Simply put:

There is nothing new under the sun

As a data analyst with 26 years web development experience, Laurie summarizes the model of technology development.

Simply put, the life cycle of a technology goes through a cycle:

propose solutions

Initially, people had a problem with the development of the project, and some people started to try to solve this problem.

Once someone comes up with a solution that makes people think this idea is great , when encountering similar problems, everyone will try to implement this solution with their own understanding.

For example, when Dan proposed the Redux model, the community did not have a better state management solution, so this solution was widely accepted, and many state management solutions based on the Redux model emerged.

It's an iterative process (and the source of many KPI projects).

Find out best practices

As the solution continues to be practiced, best practices will gradually emerge.

When best practices are created, developers usually get bored because there is nothing to explore (to build wheels) in that direction.

At this time, some boring programmer will think: I can make a big and comprehensive framework/system/product to solve this kind of problem once and for all.

That is, commoditizing best practices.

Commercialization of Best Practices

The commoditization process is usually intense, with many teams/companies/individuals getting involved, coming up with their own products, and bashing their competitors for being lacking in some way.

For example, various front-end frameworks can be considered as commodities consumed by consumers such as front-end engineers.

Consumers have their own preferences, some may like Vue , some people like React . But as a commodity, there is ultimately a de facto winner.

This is a constant economic law - to achieve a certain purpose, there may be many products to choose from, but once one of them is chosen by more people:

• As a boss, it is easier to recruit programmers who can use this product
• As a programmer, you can make better use of the community ecology of this product

This, in turn, will make the product more popular, and eventually the Matthew effect (the stronger the stronger) will occur.

For example, there are many blog site building products that appeared at the same time as Wordpress .

But as of today in 2022, 43% of the world's websites are powered by Wordpress . The gap between the second place and him is probably not an order of magnitude.

Complain about lack of foundation

When a product becomes mainstream, a voice will be heard: not just using the product/system/framework, but also understanding the principles behind it.

When Laurie was first developed, the mainstream markup language was SGML (Standard Generalized Markup Language)

HTML is just a tiny subset of SGML , characterized by a looser specification but easier to learn.

If you used HTML at that time, the senior engineer will warn you: don't just use HTML , you have to understand the behind SGML , otherwise it will not last long. of.

Large-scale application

When a product becomes absolutely mainstream and is applied on a large scale, so that it becomes a de facto infrastructure , the next generation of technicians is likely to no longer have access to the so-called principle knowledge of the previous generation.

For example, now, HTML has become the front-end infrastructure, who remembers SGML ?

Another example, now the old front end, many have used jQuery .

Before the rise of the front-end framework, everyone used jQuery to operate DOM . The source code of jQuery will also be examined during the interview.

After all, everyone agrees -- native JS is the foundation.

The selector in jQuery is so useful that mainstream browsers have it built in. This is the selector syntax of querySelector .

Eventually, querySelector became the de facto standard when choosing DOM . Who cares about the rationale behind it?

back to the start

Finally, new problems will be encountered in the development based on the new infrastructure . So, everything went back to where it started.

For example, initially developers use JSP , PHP to develop front-end pages.

Later there was CSR .

Later, in order to solve various problems of ---e7436f3cb7376ab1caddfe24b1c782a9 CSR , there SSR .

But in terms of implementation principle, JSP , PHP is not SSR .

Laurie's Prophecy

Finally, based on the above reincarnation model, Laurie makes a prediction for web development .

In a 21-year survey, 68% of developers use React to develop pages.

Laurie said: In his career, React is the only one that can reach the scale of jQuery 2365d16b05e5824adbaa27dd5cb141d8---.

Maybe in the future React will be implemented directly in the browser as infrastructure (like the selector for jQuery ).

But instead of directly integrating React itself , it may be to redesign the currently Web Components 9c21f39027e4f6e8db7b3c1de0505672 --- into a form similar to React Component .

React当前，有很多新的框架基于---0dd9d94f0718e6832c64c17fd5aa24af---实现，比如Astro 、 Remix 、 Next.js 、 Solid.js .

The developers of these frameworks assume that their users already use React and like to use React (otherwise they would not use his framework), which reflects React Has been used as front-end infrastructure.

If we accept this setting ( React will be the front-end infrastructure), then we are back to the starting point of the reincarnation model.

Is there anything that current developers use React to implement over and over again and find it boring?

One answer is: write components.

Therefore, Laurie believes that in the next five years, visual editors based on React components will become mainstream.

Similar to React Bricks :

At that time, some developers are responsible for implementing various functions React组件 , such components are called Bricks (bricks).

Most developers are based on bricks and use a visual editor to drag and drop to implement different pages.

Such developers don't even have access to HTML and the smallest unit in their infrastructure is the brick (React component).

In fact, the early browsers (developed by Sir Tim WWW ) were rich text editors implemented by dragging, typing, etc.

Oh, there is nothing new under the sun.

Summarize

If you're disgusted by this prediction -- that's all?

As mentioned at the beginning of the article, Laurie herself hates this prediction.

But history has proven time and time again that designs that were once hated are likely to eventually become mainstream (for example, in 2013, the front-end attitude toward JSX ).

Developers 26 years ago would think that only HTML and not SGML is unreliable.

Developers 10 years ago would think that only jQuery and not native JS is unreliable.

Today's developers will think that only front-end frameworks are unreliable if they don't understand the implementation principle.

Is there any possibility that developers after 5 years will think that it is unreliable to only drag and drop to generate pages and not understand the development components?