前端性能優(yōu)化必備服務器知識

image.png

大家平時上網(wǎng)只是知道輸入網(wǎng)址然后回車就顯示網(wǎng)頁出來芯丧,但是有沒有注意這背后到底發(fā)生什么事情呢?來來來世曾,今天給大家介紹一下


image.png

上面這張圖是簡單的介紹HTTP協(xié)議的步驟缨恒,具體里面的細節(jié)還是有很多的,下面這張圖就是詳細的介紹了整個流程的細節(jié)


image.png

1.Prompt for unload : 在前一個頁面加載之前轮听,初始化頁面骗露,是預先加載一些前一個頁面與下一個頁面的公共數(shù)據(jù),及初始化上下文

2.redirect:頁面重定向
2.1:redirectStart是否做過緩存血巍,做過緩存就做本地跳轉開始
2.2:redirectEnd是否做過緩存萧锉,做過緩存就做本地跳轉結束

3.APP cache:頁面緩存,是緩存就從緩存中拿數(shù)據(jù)述寡,沒有緩存就略過這步驟
3.1:fetchStart 拿緩存數(shù)據(jù)開始

4.DNS:DNS解析
4.1:domainLookupStart DNS域名解析開始
4.2:domainLookupStart DNS域名解析結束

5.TCP:進行TCP三次握手柿隙,創(chuàng)建HTTP通路
5.1:connectStart TCP連接開始
5.2:secureConnectionStart TCP安全連接開始
5.1:connectEnd TCP連接結束

6.Request:請求數(shù)據(jù)
6.1:requestStart:請求開始

7.Response:服務器返回數(shù)據(jù)
7.1:responseStart:返回數(shù)據(jù)開始
7.2:responseEnd:返回數(shù)據(jù)結束

8.Processing:加載dom骨架
8.1:domloading 正在形成dom樹結構
8.2:domInteractive 完成dom樹結構
8.3:domContentLoaded 正在加載dom樹內容
8.4:domComplete dom樹結構和內容加載完成
(記得叶洞,Processing這個過程只是加載dom樹結構,對于加載css和js這些是在onload之后加載進來的)

9.onload:頁面渲染
9.1:loadEventStart load事件加載開始
9.2:loadEventEnd load事件加載結束

10.unload:頁面卸載
10.1 unloadEventStart 卸載頁面開始
10.2 unloadEventEnd 卸載頁面結束

要進行網(wǎng)絡層的性能優(yōu)化禀崖,必須要掌握整個流程的每一個細節(jié)

image.png

DNS的數(shù)據(jù)結構


image.png

域名的分類:1.頂級域名衩辟,2.二級域名 3.三級域名
類似于baidu.com就是頂級域名 ,news.baidu.com就是二級域名帆焕,ppp.news.baidu.com就是三級域名


image.png

上面的圖就是域名樹結構惭婿,全世界只有13臺根域名服務器,13臺根域名服務器是遠遠不夠的叶雹,需要我們從根域名服務器同步數(shù)據(jù)分發(fā)到其他服務器上面去财饥,在根域名服務器里面的內容是最權威的,其他域名服務器做真正的內容解析


image.png

image.png

tcp分層


image.png
image.png

tcp數(shù)據(jù)包結構圖


image.png

序列號在tcp頭是至關重要的折晦,因為在網(wǎng)絡傳入的時候是分一段一段的數(shù)據(jù)包來傳送的钥星,有可能每一段的數(shù)據(jù)包是通過不同的路由來傳送的,這樣子序列號就起到了拿到每段數(shù)據(jù)包后满着,按照序列號來拼接數(shù)據(jù)

可以登錄linux ssh root@120.78.73.247

image.png

使用traceroute www.baidu.com就可以把訪問百度的中間路由顯示出來

在window系統(tǒng) 用tracert www.baidu.com

image.png

tcp三次握手講解谦炒,tcp連接是客戶端發(fā)起的,先發(fā)起連接請求SYN seq=x风喇,服務器通過ACK(應答號) = x+1返回給客戶端SYN seq = y 客戶端又發(fā)送ACK = y+1給服務器宁改,服務器接收到應答,雙方連接成功魂莫,三次握手完成还蹲,然后進行數(shù)據(jù)傳輸
為什么第三次握手還要想客戶端發(fā)信息來確認的,因為在tcp下面還有三層耙考,如果下面的層不穩(wěn)定谜喊,tcp連接也需要重新建立

如果第三步失敗了,客戶端認為連接是成功的倦始,但是服務器認為是失敗的斗遏,所以客戶端還是會發(fā)送數(shù)據(jù)給服務器,但是服務器認為是失敗的鞋邑,就沒有搭理客戶端诵次,所以整個tcp連接還是失敗的,需要建立tcp連接

tcp四次揮手:客戶端想服務器發(fā)起斷開請求枚碗,我要斷開了藻懒,然后服務器收到信息,想客戶端發(fā)送確認信息视译,我知道 你要斷開了,然后確認是否還有數(shù)據(jù)要給客戶端發(fā)送的归敬,如果沒有就發(fā)送第三次確認酷含,我已經沒有數(shù)據(jù)要給你了鄙早,最后客戶端給服務器發(fā)送,好的椅亚,收到了

linux下抓包
先安裝yum install tcpdump

image.png

下面是對www.baidu.com來進行抓包
先ping www.baidu.com拿到www.baidu.com的服務器的ip
image.png

image.png

然后另開一個窗口
curl http://www.baidu.com 相當于對百度一個get請求

image.png

image.png

image.png

image.png

image.png

image.png

CDN就是分布式的運用限番,一般對靜態(tài)資源放在CDN做加速,就是在不同的地方訪問呀舔,會給你請求最近的服務器

總結弥虐,上面是前端都需要了解的服務器的知識,這里只是對內容的一些見解媚赖,還需要大神們的指點

?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末霜瘪,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子惧磺,更是在濱河造成了極大的恐慌颖对,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,907評論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件磨隘,死亡現(xiàn)場離奇詭異缤底,居然都是意外死亡,警方通過查閱死者的電腦和手機番捂,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,987評論 3 395
  • 文/潘曉璐 我一進店門个唧,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人设预,你說我怎么就攤上這事徙歼。” “怎么了絮缅?”我有些...
    開封第一講書人閱讀 164,298評論 0 354
  • 文/不壞的土叔 我叫張陵鲁沥,是天一觀的道長。 經常有香客問我耕魄,道長画恰,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,586評論 1 293
  • 正文 為了忘掉前任吸奴,我火速辦了婚禮允扇,結果婚禮上,老公的妹妹穿的比我還像新娘则奥。我一直安慰自己考润,他們只是感情好,可當我...
    茶點故事閱讀 67,633評論 6 392
  • 文/花漫 我一把揭開白布读处。 她就那樣靜靜地躺著糊治,像睡著了一般。 火紅的嫁衣襯著肌膚如雪罚舱。 梳的紋絲不亂的頭發(fā)上井辜,一...
    開封第一講書人閱讀 51,488評論 1 302
  • 那天绎谦,我揣著相機與錄音,去河邊找鬼粥脚。 笑死窃肠,一個胖子當著我的面吹牛,可吹牛的內容都是我干的刷允。 我是一名探鬼主播冤留,決...
    沈念sama閱讀 40,275評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼树灶!你這毒婦竟也來了纤怒?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 39,176評論 0 276
  • 序言:老撾萬榮一對情侶失蹤破托,失蹤者是張志新(化名)和其女友劉穎肪跋,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體土砂,經...
    沈念sama閱讀 45,619評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡州既,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,819評論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了萝映。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片吴叶。...
    茶點故事閱讀 39,932評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖序臂,靈堂內的尸體忽然破棺而出蚌卤,到底是詐尸還是另有隱情,我是刑警寧澤奥秆,帶...
    沈念sama閱讀 35,655評論 5 346
  • 正文 年R本政府宣布逊彭,位于F島的核電站,受9級特大地震影響构订,放射性物質發(fā)生泄漏侮叮。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,265評論 3 329
  • 文/蒙蒙 一悼瘾、第九天 我趴在偏房一處隱蔽的房頂上張望囊榜。 院中可真熱鬧,春花似錦亥宿、人聲如沸卸勺。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,871評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽曙求。三九已至,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間圆到,已是汗流浹背怎抛。 一陣腳步聲響...
    開封第一講書人閱讀 32,994評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留芽淡,地道東北人。 一個月前我還...
    沈念sama閱讀 48,095評論 3 370
  • 正文 我出身青樓豆赏,卻偏偏與公主長得像挣菲,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子掷邦,可洞房花燭夜當晚...
    茶點故事閱讀 44,884評論 2 354

推薦閱讀更多精彩內容

  • Spring Cloud為開發(fā)人員提供了快速構建分布式系統(tǒng)中一些常見模式的工具(例如配置管理白胀,服務發(fā)現(xiàn),斷路器抚岗,智...
    卡卡羅2017閱讀 134,656評論 18 139
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,129評論 25 707
  • 好像這個芯片挺簡單的或杠。。宣蔚。不過也記錄下吧向抢,也許不一定哪天會用到 型號 總共有三種型號,區(qū)別的工作溫度和總線頻率不一...
    劍山閱讀 1,728評論 0 50
  • 一胚委、今日學習 1.胡老師網(wǎng)絡課挟鸠,2小時。 2.繼續(xù)學習簡筆畫做繪圖作業(yè)亩冬,2小時艘希。 二、訓練的項目和成績 1.記憶撲...
    世話實說閱讀 176評論 0 0
  • 唱小時光 彩鉛玫瑰大家畫多啦 來個素描版的吧
    秋天不見檒閱讀 233評論 0 1