程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 網頁編程 >> PHP編程 >> 關於PHP編程 >> PHP實現BigPipe分chunked輸出

PHP實現BigPipe分chunked輸出

編輯:關於PHP編程

在Yahoo系的最佳實踐裡,建議把靜態的內容盡早的輸出,在head之後就調用flush,讓浏覽器可以盡早去加載靜態資源,包括腳本、樣式、圖片(javascipt,css,image一般是外鏈的形式)等等,後台如果有多個數據源或者api需要調用,盡可能做到完成一個輸出一個,通過js在前端拼裝頁面,進而達到優化用戶體驗的效果,用戶等待的時間,是木桶最短的那快木板。
下面是引用:
Flush the Buffer Early
tag: server
When users request a page, it can take anywhere from 200 to 500ms for the backend server to stitch together the HTML page. During this time, the browser is idle as it waits for the data to arrive. In PHP you have the function flush(). It allows you to send your partially ready HTML response to the browser so that the browser can start fetching components while your backend is busy with the rest of the HTML page. The benefit is mainly seen on busy backends or light frontends.
A good place to consider flushing is right after the HEAD because the HTML for the head is usually easier to produce and it allows you to include any CSS and JavaScript files for the browser to start fetching in parallel while the backend is still processing.
Example:
 
      ... <!-- css, js -->
    </head>
    <?php flush(); ?>
    <body>
      ... <!-- content -->
Facebook提出的BigPipe技術,將這種思想有了更具體的實現,大體思路是,分解網頁成叫做Pagelets的小塊,然後通過Web服務器和浏覽器建立管道並管理他們在不同階段的運行。
在php下做個小測試,
 
<?phpecho 'xxxxxxxxxxxxxxxxxxxxxxx<br>';ob_flush();flush();sleep(2);echo "b";?>
結果可以看到在ie下(7,8),不管輸出內容的大小,都可以看到效果,“b“在2秒後輸出,在firefox和chrome,兩段文本都在2秒後展現,說明浏覽器做了緩存,經過實驗,緩存的大小為1024,剛好1k,也是浏覽器做的優化。通過返回頭可以看出,在分段輸出的時候,返回包沒有經過gzip。
 
通過wireshark可以看到後台輸出確實是一個個chunked過來的,看來是浏覽器做了工作,猜測:緩存大小應該是1024B或者MTU大小(1400B多點,看網絡情況),首段輸出增大到1024的時,chrome和firefox都開始正常表演了,頁面裡的js、css和圖片在第一段下載完已經開始加載。
 
應該思考的問題:
1、傳輸效率,盡量利用一次傳輸傳送盡量多的東西,根據MTU大小調整;
2、同步加載,第一塊送過來的東西,盡量可以同步加載,需要注意不同浏覽器可以同步加載域名的數量,需要考慮javascript對加載的block,對於不用立刻執行的內容,可以通過加defer或者干脆注釋掉,等頁面完成在eval進來;
3、適用范圍,任何一個技術都有自己適用的場景,對於後台需要訪問多個api的應用會更適合一些,像社交類的網站,搜索之類的本來就在100ms左右就展現完畢,純玩兒技術就沒意義了,chunked也不是分的越多越好,適當的,類似的最好合並起來;
4、ob_flush和flush最好結對使用,某些情況下,當用flush是沒有效果的。
 
參考:
 
http://www.BkJia.com/kf/201202/118114.html
 
http://developer.yahoo.com/performance/rules.html#flush
 
http://www.BkJia.com/kf/201202/118116.html
 
http://www.BkJia.com/kf/201202/118117.html
 
http://baike.baidu.com/view/4601904.htm
 
http://www.BkJia.com/kf/201202/118118.html

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved