摘要:背景是微信將要從切換成,前端的頁面需要進(jìn)行適配。以往在做滾動加載的組件時,微信內(nèi)的翻頁的時候老是要等待下一頁加載,現(xiàn)在終于不用等了。當(dāng)然也有坑,具體微信內(nèi)要怎么兼容看文檔。微信在,已經(jīng)開始灰度了,后續(xù)版本會全量。
WKWebView
背景是微信webview將要從UIWebView切換成WKWebView,前端的web頁面需要進(jìn)行適配。
什么是WKWebView官方的解釋:WKWebView是一個顯示交互式Web內(nèi)容的對象,例如瀏覽器內(nèi)的應(yīng)用程序。您可以使用WKWebView在您的應(yīng)用程序中嵌入Web內(nèi)容。為此,創(chuàng)建WKWebView對象,將其設(shè)置為視圖,并向其發(fā)送加載Web內(nèi)容的請求。
為什么要用WKWebView首先來看下UIWebView的槽點,通常的iOS App用UIWebView加載網(wǎng)頁,這個自iOS2開始使用的網(wǎng)頁加載器一直是開發(fā)的心?。杭虞d速度慢,占用內(nèi)存多,優(yōu)化困難。如果加載網(wǎng)頁多,還可能因為過量占用內(nèi)存而給系統(tǒng)kill掉。
那wk有什么特點:
1、在性能、穩(wěn)定性、內(nèi)存占用有很大提升。有的文章說4倍的渲染性能,不知真假,從體驗上來看,非常流暢。
2、允許JavaScript的Nitro庫加載并使用(UIWebView中限制);
3、支持了更多的HTML5特性;
4、高達(dá)60fps的滾動刷新率以及內(nèi)置手勢;滾動刷新頻率,從實際體驗看,確實流暢。
總得來說更快,更少,更完善,iOS 的最佳選擇。
Starting in iOS 8.0 and OS X 10.10, use WKWebView to add web content to your app. Do not use UIWebView or WebView。
iOS 8.0后的版本開始支持,目前已經(jīng)都10.+了,可以大膽的用。
對H5頁面的影響1、點擊事件,300ms的延遲還存不存?
令人高興的是,300ms的這個問題在wkwebview得到了解決。前提是需要設(shè)置user-scalable=0 的頁面,WKWebView將會移除 300ms 的 click 事件延遲。
var t; document.getElementById("j_click").ontouchstart = function(){ t = +new Date(); }; document.getElementById("j_click").onclick = function(){ alert(+new Date() - t); }; // 如果UIWebview 或者沒有設(shè)置user-scalable的wk頁面,t 大概是400ms+ // WKWebView t可以到40ms左右
fastclick這類兼容庫以及用touch事件模擬的click,可以說再見了。
2、滑動頁面JS掛起的問題還有嗎?
答案是沒有了,即使滑動頁面,js照舊執(zhí)行。所以節(jié)流函數(shù)還是很有必要,減少不必要的大量計算。
以往在做滾動加載的組件時,微信內(nèi)的翻頁的時候老是要等待下一頁加載,現(xiàn)在終于不用等了。
目前就發(fā)現(xiàn)這兩點比較明顯的改善,如果后續(xù)發(fā)現(xiàn)了再補(bǔ)充。當(dāng)然wkwebview也有坑,具體微信內(nèi)要怎么兼容看文檔。
iOS微信在6.5.1,已經(jīng)開始灰度了,后續(xù)版本會全量。兼容wkwebview需要關(guān)注的點請參考官方文檔。
參考
https://zhuanlan.zhihu.com/p/...
http://www.layabox.com/news/2...
http://nshipster.cn/wkwebkit/
本文地址:http://www.iamaddy.net/2017/0...,未經(jīng)過允許,禁止一切形式的轉(zhuǎn)載
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://m.hztianpu.com/yun/81871.html
摘要:整個小程序所有分包大小不超過單個分包主包大小不能超過微信小程序主流框架對比應(yīng)該算是最早發(fā)布的小程序開發(fā)框架,提供了類的語法風(fēng)格和特性,現(xiàn)階段應(yīng)該也是應(yīng)用最廣泛的框架吧。不過微信官方為了防止下載離線包的時間過程,也嚴(yán)格限制了小程序包的體積。 那些年我們踩過的坑css樣式不能引用本地圖片資源,只能引用線上資源(background-image),引用本地圖片資源只能用標(biāo)簽。{{}}不能執(zhí)行...
摘要:如果你對微應(yīng)用感興趣,也在開發(fā)著微信小程序,不妨來看看為了讓你減少顧慮而準(zhǔn)備的技術(shù)對比表格,是的,開發(fā)釘釘?shù)奈?yīng)用是如此的簡單。訪問這個鏈接閱讀釘釘微應(yīng)用與微信小程序技術(shù)對比表格。與內(nèi)存管理由于運行在中,此與有較大差異。 在自己的業(yè)務(wù)環(huán)境中使用,并開放給第三方isv,企業(yè)開發(fā)者使用,這是一篇有內(nèi)涵有故事的文章。 如果你對weex微應(yīng)用感興趣,也在開發(fā)著微信小程序,不妨來看看為了讓你減少...
閱讀 3506·2021-11-19 09:40
閱讀 1446·2021-10-11 11:07
閱讀 4964·2021-09-22 15:07
閱讀 2965·2021-09-02 15:15
閱讀 2017·2019-08-30 15:55
閱讀 591·2019-08-30 15:43
閱讀 939·2019-08-30 11:13
閱讀 1540·2019-08-29 15:36