# Introduction

Weixin Mini Program has always adopted a dual-threaded model of AppService and WebView, based on a mix of WebView and native controls rendering, and Mini Program optimizations extend the underlying capabilities of the Web, ensuring good performance and user experience on the mobile side.Web technology has more than 30 years of history. As a powerful rendering engine, it has good compatibility and rich features. Although the major vendors are constantly optimizing the performance of the Web, due to its heavy historical burden and complex rendering process, the performance of the Web on the mobile side is still a certain gap with the native application.

In order to further optimize Weixin Mini Program performance and provide a more native user experience,In addition to WebView rendering, we have added a rendering engine, Skyline, which uses a leaner and more efficient rendering pipeline and brings a number of enhancements to give Skyline a performance experience closer to native rendering.

# Framework

When Weixin Mini Program is based on a WebView environment, the WebView's JS logic, DOM tree creation, CSS parsing, style calculation, layout, and Paint (Composite) all occur in the same thread, and executing too much JS logic on the WebView can block the rendering and cause interface pauses. With this as a premise, the Mini Program takes into account both performance and security, using an architecture currently known as the dual-threaded model.

In the Skyline environment, we tried to change this: Skyline created a rendering thread to handle rendering tasks such as Layout, Composite, and Paint, and created separate contexts in the AppService to run the JavaScript logic, DOM tree creation, and other logic previously undertaken by the WebView. This new architecture has the following features compared to the original WebView architecture:

  • Interfaces are less prone to being blocked by logic, further reducing the amount of Catton
  • No need to create a new instance of JS engine for each page (WebView), reducing memory and time overhead
  • The framework can share more resources between pages, further reducing runtime memory and time overhead
  • Framework code no longer need to exchange data through JSBridge, reducing a lot of communication time overhead

At the same time, the new architecture maintains good compatibility with the old architecture, and Weixin Mini Program code based on the WebView environment can run directly under the new architecture with virtually no changes.As WXS is moved to AppService, although the logic itself does not need to change, the interface such as asking page information will become asynchronous, and the efficiency may also decline.To this end, we have also introduced a new Worklet mechanism that is closer to the rendering process than the original WXS to build complex animations at high performance.

The new rendering process is shown in the following diagram:

# I need help.

If you encounter any problems, go to the " Skyline Rendering Engine " section for instructions.