Introducing Lynx, TikTok’s Multiplatform Framework Based on HTML, CSS, and JavaScript with High Performance and Exceptional Flexibility for Native UI Development.
TikTok introduces Lynx, a new framework that enables the development of native user interfaces (UI) using web-based technologies such as HTML, CSS, and JavaScript. Built on a Rust-based engine, Lynx is claimed to offer high performance and supports concurrent UI processing.
Several major applications such as Disney 100 and TikTok Studio have already adopted Lynx, showcasing the great potential of this framework in the industry. However, is this truly an innovation that will change the future or just a hype? This article will review its features, performance, and compare it to React Native, a framework that has already gained popularity among mobile app developers..
What is Lynx?
Lynx is an open-source multiplatform framework developed by TikTok to enable the creation of native user interfaces (UI) using modern web technologies such as HTML, CSS, and JavaScript. Designed with high performance, flexibility, and compatibility in mind, Lynx offers easy integration with popular frameworks like React, Vue, and Angular.
What Makes Lynx Special?
Amid the competition of modern frameworks, Lynx comes with several advantages that set it apart from other similar technologies, such as:
Support for Multiple Frameworks
Lynx is not limited to a single framework. It works well with React, Vue, and Angular, providing developers with high flexibility.
Two Runtimes for Optimal Performance
Lynx uses two runtime environments: the main thread runtime to handle app launches and events, and the background runtime for executing user code. This approach reduces startup time and keeps the application responsive.
Open-Source Nature
Lynx is open-source on TikTok, allowing contributions from the developer community. This accelerates innovation and expands its ecosystem.
Native Module Support
Similar to React Native, Lynx supports native modules, allowing direct access to deeper device features for a better user experience.
First Experience Using Lynx!
The first time using Lynx, there was something interesting that made it feel very easy to use. One of the standout aspects is that Lynx requires Node.js version 18 or newer. The process of getting started with Lynx immediately gives a sense of its simplicity.
Use the following command to create a new Lynx project:
This framework offers the option to use TypeScript or JavaScript. Additionally, there is the option to add ESLint and Prettier as tools to format the source code.
When creating a new Lynx project, users are given the option to add code linting and formatting tools. The available options are:
- Biome – Used for both linting and formatting code in one tool.
- ESLint – Specifically for linting JavaScript/TypeScript code.
- Prettier – Used for formatting code to keep it clean and consistent.
The next step after creating the project in Lynx involves using Bun as the package manager. This process includes moving to the project directory, initializing a Git repository (optional), installing all necessary dependencies, and finally running the project in development mode.
Also Read : Business Process Reengineering vs Business Process Improvement
First Impressions When Using Lynx!
The first experience with Lynx gave a positive impression. This framework feels fast and responsive. It is similar to React Native in terms of development but still adheres to web development principles. With support for familiar CSS tools, development using Lynx Explorer becomes more intuitive, allowing web developers to start working immediately after running the necessary commands.
One of the key advantages of this framework is its ability to use CSS for UI design. This system allows instant style changes, with updates visible directly on the screen. This feature speeds up the development process and enhances work efficiency.
Also Read : Business Process Diagram
Styling with CSS is Interesting
One of Lynx’s main advantages is its ability to use CSS for the design process. Developers can apply styles using regular CSS files to set the appearance of components within the app. This feature makes it easier for web developers to create attractive interfaces more efficiently
How About Lynx’s Performance? Is It Faster Than React Native?
Performance is a primary focus in the development of Lynx. The framework is powered by a Rust-based engine and implements two-threaded UI updates. This approach ensures smooth and efficient app performance.
Although further testing has not been conducted, initial experiences with Lynx indicate quick responsiveness and optimal performance. UI updates feel seamless, and app startup times are relatively short. However, more testing is required to truly compare Lynx with React Native. Even so, the first impression of Lynx is promising.
Conclusion
The main question that arises is whether Lynx can surpass React Native.
At this point, it’s too early to conclude. Lynx shows great potential as a framework with unique advantages. Its ability to implement CSS styling and use two runtimes adds positive distinctions.
Lynx is not a direct replacement for React Native but can be an ideal choice for certain needs. Web developers may find Lynx appealing since it allows them to continue working with web technologies they are already familiar with.
For web developers looking to transition to mobile app development, Lynx is worth trying. Its working environment feels familiar and offers quite good performance. Keep an eye on Lynx’s progress, as this framework has the potential to become a key player in mobile app development.
References
Author : Arief Yusuf Winata
