Cross-platform development is a popular development direction at present. React Native has achieved great success in this aspect, while Flutter has also gained a lot of attention. React Native adopts Web framework development and uses Native UI for rendering, which greatly reduces the threshold of Native development and improves the efficiency of iteration. However, it inevitably has some shortcomings.

As a long-time developer of RN, I know that there are some technologies that don’t work well on existing FRAMEWORKS like RN. For example, the speed of the first screen, the complexity of the follow-through animations, and the experience on native Android and iOS are certainly not the same. Of course, these glitches shouldn’t stop cross-platform development. I also continue to pay attention to Flutter. This framework solves the performance problem of RN, but also increases the learning cost.

Lynx

Recently, I discovered a new cross-platform framework Lynx. According to the official introduction, this framework is still in the alpha state, there is no complete document at present, only demo. However, after experiencing the demo provided by this framework, I feel that I can continue to pay attention to it. Lynx officially claims that it has the same first-screen speed and interaction experience as Native. After experiencing the demo, it is found that the first-screen speed and interaction are indeed excellent.

experience

The Android SDK and NDK have been downloaded before RN and Flutter are compiled. It is relatively convenient To follow the How To Build method.

The final effect is consistent with the official GIF, but the overall demo is relatively small and slightly simple. The page development process has not been tried yet, so let’s see how it works.

In the introduction of Lynx, I saw some different features compared with other existing cross-platform frameworks. Based on my own experience and official introduction, I will give a brief introduction:

  1. The first screen display of the page, as you can see from the demo given, can be made straight like the native Android and iOS pages, basically without any white screen. This is actually a nice point compared to RN.
  2. Interactive animation, also known as follow-on animation, is really difficult to implement on RN (due to a layer of JSBridge in the middle), or to expand Native modules. The interactive animation on the Demo was very smooth, without any lag, and even had a better effect than the Flutter frame rate.
  3. JSBinding mechanism, according to the official statement, there is a more efficient JSBridge, but I don’t feel it in the experience for the moment, I will study the code later
  4. Dynamic release testing, a must for all cross-platform frameworks, is nothing new. This documentation presentation needs to be combined with scaffolding Lynx – CLI.

What is the realization principle of page direct display and full frame interactive animation? The official has given a simple work flow chart and introduction. Understand the basic know the answer to this question, the page shows fast because the first screen display into layout file, thus skipping the JS, perform the tasks generated first screen elements and the realization of the interactive animation is also through the middle of interactive animation engine directly after receives the event response, so as to skip the intermediate steps of JS.

After playing Lynx, it was worth watching to see how far it could go.

The last

Lynx framework is still in the alpha stage, so it cannot be directly used to develop applications to be launched for the time being, and its functions are not yet complete. However, we can pay attention to its development. After all, this technology is different from RN in implementation.

After you’ve tried the demo, be ready to look at the code and get a look at the internal implementation. Lynx’s warehouse also provides a list of apis that can be used, and simple practices will be carried out according to the API in the future. Hopefully, more cross-platform frameworks will emerge to push the technology forward.

Attach a Lynx warehouse address: https://github.com/hxxft/lynx-native