Looking at the front-end development trend in 2024 from 2023

Preface

Looking back at the past, throughout 2023, the entire front-end industry has shown a decline in all industries, and there are many theories such as "the front-end is dead". Looking at the IT industry from a global perspective, except for the explosion of large language models in the AI ​​field, there are few particularly eye-catching and outstanding technical displays as a whole. Therefore, as a front-end industry that is a subdivision in the IT field, coupled with the impact of the overall economic cycle, this year's situation can be considered to be due to factors. However, if something goes wrong, you need to turn to yourself. I personally think that all front-end students should strive for opportunities to "create new things" with a "keep upright" attitude. Therefore, the following individuals will share some strategies that front-end students should adjust as well as some possible opportunities and trends in the next year.

Keep upright

“Only by staying centered and upright can we achieve stability and progress.” As a front-end engineer, I personally believe that under the current situation, we need to abandon vain and useless tricks and focus on improving the underlying core. What is "strange and obscene skills"? I personally think that the grotesque techniques in the front-end are nothing more than the presentation techniques of various gorgeous effects without exploring its underlying core, that is, only focusing on the realization of the moment, regardless of the inner principles. The so-called "not asking for a deep explanation" is roughly like this . Personally, I think that if you focus too much on technique, you will easily get caught up in the satisfaction of completing the details. Only by seeing the inner essence through the phenomenon can you draw parallels. "A point moves to form a line, a line moves to form a surface, and a surface moves to form a body." Seize the underlying connections and form your own systematic system. Only by driving the extension from the core can you truly maintain a high-level vision and pattern. As the saying goes, "Great skill has no craftsmanship, and a heavy sword has no edge." Only by keeping exploring and thinking about the underlying principles can we abide by the Tao and use the tools to practice the art. For example, the exploration of the JavaScript language itself is more important than the implementation of the logic of a page. Only when the internal repair is stable can a qualitative leap be formed. Practice is often very boring and difficult to persist. Therefore, "Looking up will make you taller, and drilling into it will make you stronger." Only a strong inner core can promote the expansion of external objects.

New

"Those who understand change will win, and those who keep upright and create innovation will advance." It is true that changes in the general environment have also catalyzed changes in the entire front-end trend. In recent years, most of the innovations in the front-end industry have generally come from the extension and integration of other fields. In order to better adapt to current changes, front-end engineers cannot just limit themselves to their own work scope without expanding new boundaries. Personally, I believe that the next few years will definitely move towards a more integrated and diversified trend. A front-end with multiple capabilities and "specialized combat capabilities" is the true modern front-end. If a front-end only knows front-end, it will not be the best front-end. If you want to be able to efficiently expand your boundaries, you need the infinite amplification brought by the core system that has been accumulated by "keeping integrity". Therefore, "Every fighter must use the right combination to win with surprise." Only by staying true to the original and being humble can we innovate and bring forth the new.

To sum up, as a front-end engineer in the new era, the front-end will not die but will only evolve. Or to be more precise, the front-end in the traditional sense is indeed dead, but the modern front-end will require T-shaped talents with special expertise and more comprehensive "specialized individual combat capabilities." So, in terms of special capabilities, I personally believe that there will be the following changes in the engineering direction, Node.js direction, cross-end direction, intelligent direction, interaction direction, middle and backend direction, and visualization direction in the next year:

Engineering direction

First of all, regarding the direction of engineering, I personally think there will be the following trends:

1. Rustization: RustThe intrusion into the field of front-end engineering has become an irreversible trend, but the existing JavaScripttool chain will not die. In the end, a balanced form of integration and optimization should be formed, such as: the combination of rust and js in series and parallel, etc. Tool reference: swc, Turbopack, Rspack, Rolldownetc.;

2. Low Code: The popular form of Low Code that has been talked about for several years has actually existed for a long time, and it did not appear in recent years. Moreover, "low code is not a silver bullet"! In the field of engineering 2D (to Developer), the highlight of low code is code production, and the complexity of Pro Code and Low Code will have a critical value. Beyond the critical value, the complexity of Low Code will increase exponentially;

3. Supply chain construction: In the future, front-end engineering will form upstream and downstream links like traditional supply chains, and the security and component protocols will be an important driving force for cost reduction and efficiency improvement in the future;

4. Platform engineering: The current technological explosion has made the choice difficult. Platform engineering is actually an idea of ​​​​simplifying complexity. The method may not be correct, but the direction of convergence is correct;

5. Large repository processing: It is an inevitable result after the emergence of monorepo. It will bring new challenges to the changes in warehouse management and Git CLI extension.

Node.js direction

Secondly, for the direction of Node.js, Node.jsit is difficult to make new changes. In the future, it will develop in a safe and stable direction, and the accompanying environmental ecology is the focus of the changes, including:

1. Edge computing: Node.jsIt has natural advantages on the edge side. The JavaScript engine and the first priority of functions are very suitable for edge scenarios, and the competition for edge runtime (Edge Runtime) will be the focus of competition among major cloud vendors;

2. tRPC: Just Golike gRPC, tRPC-based TypeScriptremote calling is also an RPC implementation and is more suitable in edge scenarios;

3. Traffic calculation: In the cloud-edge-device collaboration scenario, the collaborative update of edge-side products will involve traffic calculation, edge KV, etc., refer to: Ant Financial Unio framework.

span direction

Furthermore, for the cross-terminal direction, the 2C field is becoming increasingly weak, and new terminal forms will become mainstream, including:

1. TS + Wasm: A tool chain that directly compiles TypeScript into wasm, so that the front end can truly use Wasm and be truly cross-platform. Case references: WASMR, TS2WASM, etc.;

2. IoT: Consider the development and use of different IoT devices, including watches, glasses, etc.;

3. Hongmeng: application development based on Hongmeng operating system, such as: ArkUI, ArkTS, etc.;

4. Multi-terminal model: Domination by one company will not be realized, multi-terminal model is the future;

5. Kernel: Based on the existing kernel tuning and optimization, multi-terminal enhancement capabilities are unified.

Intelligent direction

Intelligence is the hottest topic this year, and the front-end is no different. The impact on the front-end field may change as follows:

1. AIGC: It is difficult for the front-end to get involved in the research on the bottom layer such as large language models. It is more about the reform and innovation of its upstream application layer. LUI (Langchain UI) or AUI (Artificial UI) may appear relative to GUI (Graphic UI);

2. ChatGPT: The application of existing GPT best practices on the front-end side currently mainly includes: unit testing and Code Review and other scenarios;

3. Editor: All editors are entrances to large language models, including: developer IDEs and low-code editors;

4. WebNN: The Web domain directly calls machine learning capabilities. Currently, a draft candidate recommendation has been released, and you can pay attention to subsequent changes;

5. SDK: The front-end provides upper-level developer packaging based on large language model capabilities, including: Vercel AI SDK, etc.

Interactive direction

The interactive direction seems to be dominated by the intelligent direction, but its inherent potential is also great and may become an explosion point this year:

1. DAPP UI: The front-end in the blockchain field is mainly based on DApp-related practices. You can refer to: Ant Financial’s new Ant Design Web3 component library;

2. Digital twin: Combined with existing game engines such as Unity and Unreal to achieve interactive rendering on each end, such as: WebF, etc.;

3. Space applets: Develop applets in the AR space to implement applications for new head-mounted display devices such as Vision Pro, such as JSAR, etc.;

4. Privacy Computing: Application development in emerging directions such as privacy chains.

Middle and backstage direction

As major companies such as Alibaba dismantled the middle and backends and divided their business systems, the direction of the middle and backends has also gradually changed from monolithic to micro-frontends:

1. Web Components: All micro-frontends based on Single Spa are a kind of adaptation and compromise of existing technologies. Only with the comprehensive promotion of Web Components can it be possible to realize the front-end componentization on the browser side, and the corresponding component library form will not change. Depends on the framework, refer to: Quarkc, Lit, etc.;

2. Micro-application: Similar to the previous island architecture, middle and back-end applications are built in the form of micro components (Widgets);

3. Visual configuration: To achieve better editing and customization effects, configure a single page, refer to: Builder.io;

4. Page template: Extract more page templates instead of applying Template to the entire page and break it into parts.

Visualization direction

In the direction of visualization, many emerging forms of presentation have emerged, including:

1. Visual narrative: Provides visual presentation of narrative forms and dynamically displays static icons. Reference: VisActor, etc.;

2. Hybrid rendering: The rendering method draws on more other rendering solutions, such as: rust+wasm+webgl 3D rendering;

3. Web BIM/CIM: Web visualization presentation in heavy business fields, including: Building Information Model BIM (Building Information Modeling), City Information Model CIM (City Information Modeling), etc.

Summarize

To sum up, the front-end development in 2023 can be summarized as follows:

Keep upright and upright, reach far and create new things

Knowledge always reveals changes, harmony and righteousness emerge unexpectedly

Engineered to rust, run on edge

Multi-terminal compilation, intelligent overlay

Interaction differentiation, widget combination

Display of movement and stillness, rendering multiple lights

Take advantage of the situation and turn the stone into a mountain

The front end is not dead, the future is promising

2024 is here. I hope all front-end developers will think carefully, make decisions, and encourage each other in the new year!
Author-Wei Li Design