客戶端主要有兩種選擇:一種是基于瀏覽器HtML5頁面的，一種是Native模式的。到底是選擇HTML5還是Native， Native 如何解決快速迭代問題?
1.是Native還是HTML5
當前移動端主要還是以Native實現為主，從用戶體驗角度來考慮，Native的實現要比HTML5更流暢，同時Native還可以基于本地做很多在瀏覽器里不能做的優化，如大數據的存儲、可以定制的通信協議、更方便地保持長連接以及更容易實現的實時消息推送。

當然HTML5也有無法比擬的優勢，比如客戶端更輕量級、服務端發布更迅速、不需要用戶升級版本等。長期來看，移動端是否會像早期PC那樣從富客戶端轉向瀏覽器呢?筆者覺得未必，理由如下。
首先，相比HTMLS， Native實現性能優勢更好。當前移動端都在追求極致體驗，App無疑會比HTMLS有更多的優勢；其次，移動端屏幕較小，基于網頁的交互和App相比還有很多限制。最重要的是，不同的商家會主推帶有品牌標識的App還是會向統一-的瀏覽器靠攏?從目前的趨勢看，App會是手機端上爭奪的重點，所以筆者推測直接基于手機端的瀏覽器的應用不會成為主流的前端。
2. HTML5的頁面優化
HTMLS頁面優化一般可以從以下幾個地方人手。
第一，CSS內聯異步加載。如果頁面中有內容要依賴CSS的加載，很多時候就會出現白屏一這其實就是CSS阻塞了加載，CSS出不來就導致看不到首屏。CSS內聯加載可以節省異步HTTP請求，CSS內聯異步加載后可以大大緩解白屏問題。不過，就算內聯以后也要觀察異步CSS文件的大小，并且異步之后要觀察domReady的時間變化。當然CSS內聯也有可能會導致repaint和reflow的問題，并且由于異步內容增大，服務端的性能開銷也會增加。
第二，其他的優化。端上的優化已經有一整套的優化方法列表了， 這里介紹一些我們在實踐中發現并驗證過的一些特別的優化點，如assets 合并、整合頁面中inline的JSICSS到外部文件、將iframe改為JSONP調用、背景圖合并和將非首屏內容加載改為異步等。
第三，bigpipe首屏加載。2012年的時候，Facebook有一個比較火的技術叫bigpipe，可以提升頁面的首屏加載效果，于是我們嘗試過采用類似的技術測試首屏的加載效果，
點擊鏈接http://www.webpagetest.org/video/compare.php?tests=140318 M5_ 7GV%2C140318 Z2 7CJ&thumbSize=200&ival=100&end full，可以通過webpagetest看到頁面的優化效果。
3. Cookie壓縮
在無線場景下要額外注意Cookie，如果沒有留意，它可能會占用你一次無線請求下的大部分內容，而且有可能并不會讓你察覺，所以有必要對Cookie進行壓縮測試。Cookie是在HTTP的頭部，通常的gzip和deflate都是針對HTTP body的壓縮但并不能壓縮Cookie，要想對Cookie做壓縮測試必須單獨處理，壓縮方式是將Cookie的多個K/V對看成普通的文本，進行文本壓縮。
4. URL短域名
URL短域名也很好理解，如果無線數據傳輸中有大量的域名，而域名又比較長，就會產生很多無謂的數據傳輸，最典型的應用像微博的hp://.cn，可以節省很多字節。但是像這種直接使用真實的t.cn的短域名是比較奢華的辦法，比較簡單的是使用約定的標簽替換，在解析時再替換回去。
5. CDN前置緩存
在有大量靜態數據請求的頁面中使用CDN前置緩存對網站的加速訪問非常有效。對比分析了杭州主站和CDN上的兩張圖片，一張是空圖片，一張是50KB大小的圖片。空圖片用于測試RTT， 50KB的圖片用于測試網速。
6.如何實現端的快速迭代
前面介紹了無線場景下端的優化措施，那么當我們使用Native來實現時，遇到的一個問題是基于App的Native如何解決客戶端更新和服務端的快速迭代問題，一-般有兩種思路:一種是客戶端用同-一種技術開發，然后通過工具編譯技術把它編譯成不同平臺，上能夠執行的代碼，如當前的React Native； 另一種思路是將客戶端中經常需要更新的模塊做成動態推送的，用模板+數據的方式，在不同的客戶端平臺上實現一個小的解析引擎來實現快速個性化的定制。
那么再說回來，基于前面的這些推斷，網站建設多終端和服務端交互主要是以數據+模板的方式為主，那么服務端提供格式化的數據將成為必然選項。所以涉及的問題就是服務端既要提供格式化的數據( HTTP JOSN數據)，又要支持傳統的PC的方式:基于JOSN數據渲染出HTML頁面。我們在后面會進一步介紹如何解決無線和傳統PC之間的這種差異。

網頁題目：網站客戶端的演進
分享網址：http://m.newbst.com/news48/151948.html

成都網站建設公司_創新互聯，為您提供商城網站、外貿網站建設、微信小程序、云服務器、用戶體驗、網站設計公司

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯