Shulou(Shulou.com)06/02 Report--

How to analyze the iOS WKWebView instant program, many novices are not very clear about this. In order to help you solve this problem, the following editor will explain it in detail. People with this need can come and learn. I hope you can get something.

Preface

WKWebView instant solution requires not only end-to-end optimization, but also front-end and front-end cooperation. In the early days of our business, we have achieved instant opening on UIWebView through various optimizations. However, since Apple was not allowed to launch UIWebView in December 2020, we urgently switched to WKWebView. However, due to the unsatisfactory performance of WKWebView at startup initialization, our goal is to open at least most of the pages on low-end models. After a series of optimization operations, the results and data are very considerable.

Second open flow chart

Second opening scheme

1. Download the template.

2. The first picture is preloaded.

3. Body prefetching of body list.

4. CDN preloading.

5. Double cache pools (currently no more than 8): one is responsible for asynchronously performing js preheating when the scrolling of the feed flow list stops; the other is responsible for preparing a clean WKWebview for the next missed WKWebview after entering the article.

6. Click cell to hit the preheated instant WKWebview, and then preheat the next article, so as to improve the second opening rate.

7. The WebView preheated by initpage needs to be hidden on the far right side of the screen, then display and reset the frame to return to the normal view after entering.

8. The WebView preheated by the feed stream passes the false parameters through initPage, and the WebView after entering the article page passes the true parameters through initPage. To ensure that it will not refresh and jump, flag is set in the template to ensure an initPage.

9. Dynamic js backfilling solution: the load template → will receive the front-end bridging Ready status when the → client receives the Ready status, and the initPage operation will be performed when the client receives the Ready status. This is only the interface that statically loads the page and renders it for the user to see, and will not trigger any network or other template loading. The initPage will call back the init status when the client receives the init status and will perform showPage operations. Indicates that you have entered the page and needs to continue to load all unloaded logic, such as image rendering, network request, template loading, etc. After showPage is successful, the front end callback show status → client still means that the page has been loaded and handles the logic after loading, such as typing and reporting.

10. The global WKWebview is not released, but as soon as you enter the article page, the WKWebview that needs to be preheated next time will be pre-created to ensure that each WKWebview is clean and history-free, and the currently loaded WebView of the double cache pool will be released in the dealloc method.

Among them, initpage and showPage are the front-end processing-related logic callback to the client status, and the client gets the status for the next step.

Technical data Item end-to-end average end-to-end p90 time control group 1210 ms2800 ms experimental group 780 ms1800 ms second opening effect comparison

Low-end model: real phone 6p focus 12.4.5 system

Optimize the frontline UIWebview display:

WKWebview presentation:

What's so good about WKWebView?

Less memory overhead

Built-in gesture

Support for more H5 features

Have the same JavaScript engine as Safari

Provide more attributes, such as loading progress, title, accurate number of pages, and so on.

Provides a more refined callback of the loading process (of course, it seems a little more troublesome than UIWebView, after all, there are many ways)

Is it helpful for you to read the above content? If you want to know more about the relevant knowledge or read more related articles, please follow the industry information channel, thank you for your support.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.