fluent-perfcourse.pdf

《fluent-perfcourse.pdf》由会员上传分享，免费在线阅读，更多相关内容在学术论文-天天文库。

1、BuildingFasterWebsitesWebRTCcrashcourseonwebperformanceIlyaGrigorik-@igrigorikMakeTheWebFastGoogleWebperformanceinoneslide...CriticalrenderingpathHTMLDOMRenderNetworkJavaScriptLayoutPaintTreeCSSCSSOMIn-appperformance@igrigorikThanks.Questions?Twitter@igrigorikG+gplus.to/igrigorikWebigvit

2、a.com2Criticalrenderingpath:resourceloadingHTMLDOMRender1NetworkJavaScriptLayoutPaintTreeCSSCSSOMLatency,bandwidth3G/4G/...3In-appperformance:CPU+Render@igrigorikWhat'stheimpactofslowsites?Lowerconversionsandengagement,higherbouncerates...serverdelaysexperiment"2000msdelayreducedperuserr

3、evenueby4.3%!"●Strongnegativeimpacts●Roughlylinearchangeswithincreasingdelay●TimetoClickchangedbyroughlydoublethedelayPerformanceRelatedChangesandtheirUserImpactImpactof1-seconddelay...Impactof1-seconddelay-StrangeloopHowspeedaffectsbouncerateYohohoandafewbillionpagesofRUM@igrigorikSites

4、peedisasignalforsearch"Weencourageyoutostartlookingatyoursite'sspeed—notonlytoimproveyourrankinginsearchengines,butalsotoimproveeveryone'sexperienceontheInternet."GoogleSearchQualityTeamUsingsitespeedinwebsearchranking@igrigorikSpeedisafeature.So,howarewedoingtoday?Okay,Igetit,speedmatte

5、rs...but,arewethereyet?DelayUserreaction0-100msInstant100-300msSlightperceptibledelay"1000mstimeto300-1000msTaskfocus,perceptibledelayglasschallenge"1s+Mentalcontextswitch10s+I'llcomebacklater...●Simpleuser-inputmustbeacknowledgedwithin~100milliseconds.●Tokeeptheuserengaged,thetaskmustco

6、mpletewithin1000milliseconds.Ergo,ourpagesshouldrenderwithin1000milliseconds.Speed,performanceandhumanperception@igrigorikOurapplicationsarecomplex,andgrowing...DesktopMobileContentTypeAvg#ofrequestsAvgsizeAvg#ofrequestsAvgsizeHTML1056KB640KBImages56856KB38498KBOuch!Javascript15221KB1014

7、6KBCSS536KB327KBTotal86+1169+KB57+711+KBHTTPArchiveDesktop:~3.1sMobile:~3.5s"It’sgreattoseeaccessfrommobileisaround30%fastercomparedtolastyear."Isthewebgettingfaster?-GoogleAnalyticsBlog@igrigorikGreat,networkwillsaveus?Right,right?Wecanjustsitbackand...Averageconnections