Web Ping: Difference between revisions
Jump to navigation
Jump to search
m
Reverted edits by 172.70.98.68 (talk) to last revision by Planetoid
m (Reverted edits by 172.70.98.68 (talk) to last revision by Planetoid) Tag: Rollback |
|||
| Line 17: | Line 17: | ||
Thanks, Sara Alvarado | Thanks, Sara Alvarado | ||
=== 分析網頁連線下載速度 === | |||
* {{Gd}} [http://developer.yahoo.com/yslow/ Yahoo! YSlow] + [http://www.getfirebug.com/ Firebug] for {{Fx}}: [http://www.getfirebug.com/net.html Firebug and Network Monitoring] (說明: [http://briian.com/?p=5526 Firebug 幫網頁稱重量、測速度,抓出拖慢網站的元兇! 【重灌狂人】])操作方式: 按{{kbd | key=F12}} 啟動Firebug, 然後切換到「網路」標籤 | |||
: http://farm3.static.flickr.com/2083/1776124036_800ff3441d_o.jpg | |||
: Image hosted by [http://www.flickr.com/photos/planetoid/1776124036/ Flickr] | |||
* [http://www.fiddler2.com/fiddler2/ Fiddler Web Debugger - A free web debugging tool] | |||
: http://farm6.static.flickr.com/5213/5457161299_6410ae7c01.jpg | |||
: Image hosted by [http://www.flickr.com/photos/planetoid/5457161299/in/photostream/ flickr] | |||
* [http://www.httpwatch.com/ HttpWatch: An HTTP Viewer and HTTP Sniffer] for {{IE}} 6 & 7 & {{Fx}} | |||
** 介紹: [http://steachs.com/archives/1450 網頁診斷工具【HttpWatch Basic Edition】即時分析網頁瀏覽數據 for IE、Firefox] | |||
* [https://addons.mozilla.org/en-US/firefox/addon/httpfox/ HttpFox][http://code.google.com/p/httpfox/] An HTTP analyzer addon for {{Fx}} | |||
* [http://tools.pingdom.com/fpt/ Pingdom Tools]([http://www.flickr.com/photos/planetoid/5096188393/ 圖例]): (a)測試網頁各元件載入時間(Full page test),圖形化呈現載入時間長短,藉此觀察網頁效能、 (b)以及從Pingdom Tools網站到目標網站的連線檢查(Ping、trace route) | |||
* [http://webwait.com/ WebWait - Benchmark Your Website] 網頁下載計時器 | |||
* [http://www.websiteoptimization.com/ Web Site Optimization: Speed Up Your Site website opion web speed optimize web site performance company] --> Web Page Analyzer | |||
* [https://chrome.google.com/extensions/detail/ognampngfcbddbfemdapefohjiobgbdl Speed Tracer (by Google)] for {{Chrome}} | |||
* [http://www.webpagetest.org/ WebPagetest - Website Performance and Optimization Test] | |||
* [https://www.giftofspeed.com/ Test & Optimize Website Speed - GiftOfSpeed] 可以選擇從荷蘭、美國、英國、新加坡、德國其中一處連線測試。測試結果包含不同網頁元件下載所需時間。{{access | date = 2016-07-28}} | |||
==== Monitor HTTP request ==== | |||
追蹤瀏覽器提出的網站網址要求(ex: URL of AJAX JSON) | |||
* [http://www.fiddler2.com/fiddler2/ Fiddler Web Debugger - A free web debugging tool] for {{Win}} | |||
* [http://getfirebug.com/logging Firebug] for {{Fx}} | |||
* [http://www.httpwatch.com/ HttpWatch 8.5: Seamless HTTP monitoring for IE and Firefox] for {{IE}} & {{Fx}} | |||
* {{Chrome}} 工具 -> 開發人員工具 -> Network | |||
==== 分析網頁連線下載速度,並提供網站開發者建議的服務或軟體 ==== | |||
* {{Gd}} [http://code.google.com/speed/page-speed/ Page Speed Home] for {{Fx}} | |||
* [https://developers.google.com/speed/pagespeed/insights PageSpeed Insights — Google Developers] offered by Google: [https://developers.google.com/speed/pagespeed/insights#url=www.google.com.tw&mobile=false Sample report] {{access | date= 2012-08-14}} | |||
** 教學: [http://briian.com/?p=6315 Google Page Speed 網站最佳化建議工具,讓網站更快、更省流量!] | |||
* Google chrome -> 工具 -> 開發人員工具 -> Audit。 提供網站開發者 Network utilzation, web page performance建議。 | |||
* [http://www.slowcop.com Slowcop] {{access | date = 2011-03-17}} 教學: [http://www.freegroup.org/2011/03/slowcop/ Slowcop 網站測速工具,找出如何使網站開啟速度更快] | |||
* [http://gtmetrix.com/ GTmetrix] "Website Speed and Performance Optimization" {{access | date= 2012-08-14}} | |||
** 介紹: [http://freegroup.org/2010/07/gtmetrix/ GTmetrix 線上網頁速度檢測、分析工具,協助改善用戶經驗] | |||
* [http://www.webpagetest.org/ WebPagetest - Website Performance and Optimization Test] 介紹: [http://briian.com/?p=9069 WebPagetest 網頁連線、載入速度測試工具(支援 30 測試點、16 種瀏覽器、測試手機版與桌面版網頁) | 重灌狂人] | |||
* [https://www.dareboost.com/en/home DareBoost - Website Performance and Quality Test Tool] 輸入網址可以測試網頁效能與內容品質。看摘要內容不需要註冊會員,關掉它的提示還是可以進行測試。{{access | date = 2015-04-11}} | |||
* Google 的 [https://web.dev/ web.dev] 服務提供效能、最佳實務建議、網頁親和力 ([[Accessibility]])、SEO (搜尋引擎最佳化) 等的評分與建議。範例報表: [https://lighthouse-dot-webdotdevsite.appspot.com/lh/html?url=https://www.google.com Lighthouse Report] {{access | date = 2018-11-15}} | |||
相關頁面 | |||
* [[Javascript#performance_issue:_compression_tools.2C_using_CDN | javascript 檔案壓縮或使用 CDN]] | |||
* [[CSS_tools#CSS_.E6.AA.94.E6.A1.88.E5.A3.93.E7.B8.AE | CSS 檔案壓縮]] | |||
=== 觀察HTTP response status code(HTTP回應狀態代碼) === | === 觀察HTTP response status code(HTTP回應狀態代碼) === | ||