Web app and native app performance comparison

The website has some obvious advantages over mobile apps.

• Cross-platform: all systems can run
• No install: Open the browser, you can use
• Rapid deployment: Upgrades only need to update the code on the server
• Hyperlinks: can be connected with other websites, can be retrieved by search engines

But what is the reality?

(1) Poor experience. Mobile app's smooth operation, far beyond the website.

(2) The industry does not support. All of the company's mobile development focus, almost all native apps.

(3) The user does not care. Most users choose to use the mobile app instead of the website.

If one day, the Web app will become mainstream, there must be a premise that its performance can catch up with the native app.

The Web app loses to the native app, not the interface (UI), but the performance of the operation. mainly interactive (interaction) and animation (animation) These two aspects, will appear the Lag (Jank), the user will feel the obvious time lag, sometimes is simply unbearable.

The performance bottleneck for Web apps is mainly for the following reasons.

(1) The web is DOM-based, and the DOM is slow. When a browser opens a Web page, it needs to parse the document, generate the DOM structure in memory, and the process is slow if complex documents are encountered. Imagine how long it takes to generate a DOM if there are tens of thousands or even hundreds of thousands of of shapes on the page, whether it's a picture or a CSS? Not to mention interacting with one of these shapes.

(2) Dom slows down JavaScript. All DOM operations are synchronized and clog the browser. When JavaScript operates the DOM, it must wait for the previous operation to finish before performing the latter operation. As long as one operation is stuck, the entire page loses its response briefly. The browser redraws the Web page at 60FPS (that is, 16 milliseconds/frame), and JavaScript does not perform DOM operations within 16 milliseconds, resulting in a skip frame. The non-fluent, incoherent user experience stems from this.

(3) The Web page is single-threaded. Now the browser for each page, only one thread processing. All work is done on this one thread, including layout, rendering, JavaScript execution, image decoding and so on, how can it not be slow?

(4) The webpage does not have hardware acceleration. Web pages are processed by the CPU, and GPU-accelerated graphics are not used.

Above these reasons, for the PC also does not cause serious performance problems, but the mobile phone hardware resources are relatively limited, user interaction is relatively frequent, the results with native app a ratio, it fell completely downwind.

Web app and native app performance comparison