書馨卡幫你省薪 2024個(gè)人購(gòu)書報(bào)告 2024中圖網(wǎng)年度報(bào)告
歡迎光臨中圖網(wǎng) 請(qǐng) | 注冊(cè)

前端性能揭秘

作者:佘錦鑫
出版社:電子工業(yè)出版社出版時(shí)間:2022-10-01
開(kāi)本: 16開(kāi) 頁(yè)數(shù): 292
中 圖 價(jià):¥63.0(6.3折) 定價(jià)  ¥100.0 登錄后可看到會(huì)員價(jià)
加入購(gòu)物車 收藏
運(yùn)費(fèi)6元,滿39元免運(yùn)費(fèi)
?新疆、西藏除外
本類五星書更多>

前端性能揭秘 版權(quán)信息

前端性能揭秘 本書特色

本書雖名為前端性能揭秘,但涉及領(lǐng)域遠(yuǎn)遠(yuǎn)不止前端。系統(tǒng)性從性能的度量、分析、優(yōu)化、防腐,抽絲剝繭般地娓娓道來(lái)—— 1.前端老鳥也不甚了了的前端性能優(yōu)化硬核知識(shí)。 2.性能是前端技術(shù)挑戰(zhàn)巔峰與工程師追求的極限。 3.涉及底層網(wǎng)絡(luò)到上層框架值得長(zhǎng)期投入眾課題。 4.三位一體思路:性能度量+工具分析+優(yōu)化解決。 5.從用戶體驗(yàn)角度理解瀏覽器處理頁(yè)面生命流程。 6.剖析數(shù)據(jù)收集分析、各項(xiàng)性能指標(biāo)定義及優(yōu)化。 本書既有大量理論基礎(chǔ),也有扎實(shí)實(shí)戰(zhàn)佐證,值得一讀。

前端性能揭秘 內(nèi)容簡(jiǎn)介

本書主要介紹用于指導(dǎo)前端性能優(yōu)化工作的通用優(yōu)化方法,從網(wǎng)絡(luò)、瀏覽器、構(gòu)建工具、跨端技術(shù)和CDN等方面介紹不同技術(shù)、系統(tǒng)對(duì)性能的影響,同時(shí)幫助讀者了解如何有效優(yōu)化性能。本書從性能的度量、分析和實(shí)驗(yàn)這三個(gè)方面開(kāi)始介紹。首先介紹性能優(yōu)化的一些通用方法,然后將性能作為一個(gè)切面幫助讀者了解與前端技術(shù)棧和性能有關(guān)的知識(shí)。從這個(gè)切面觀察,這些系統(tǒng)的工作原理等知識(shí)被賦予了另外一層意義,通過(guò)這種聯(lián)系把工作原理真正運(yùn)用到工作中,在性能優(yōu)化方面發(fā)揮重要作用。本書面向的讀者為具有一定經(jīng)驗(yàn)的Web開(kāi)發(fā)工程師,以及對(duì)前端開(kāi)發(fā)或Web開(kāi)發(fā)有一定了解的開(kāi)發(fā)人員。同時(shí),假定讀者能夠進(jìn)行簡(jiǎn)單的網(wǎng)頁(yè)開(kāi)發(fā),并且具備相關(guān)的基礎(chǔ)知識(shí)。

前端性能揭秘 目錄

第 1 篇 從 Vite 起步

第 1 章 從實(shí)踐開(kāi)始 ··························· 2

1.1 Hello World ···························· 2

1.2 現(xiàn)實(shí)開(kāi)發(fā)的例子 ······················· 7

1.3 小結(jié) ································· 15

第 2 篇 性能優(yōu)化方法論

第 2 章 度量 ································· 18

2.1 科學(xué)的方法 ·························· 19

2.2 初識(shí) Performance API ··············· 21

2.3 均值、分位數(shù)和秒開(kāi)率 ············· 23

2.4 度量首屏 ···························· 27

2.5 度量流暢度 ·························· 30

2.6 Core Web Vitals ····················· 34

2.6 小結(jié) ·································· 41

第 3 章 分析 ································· 42

3.1 分析方法 ···························· 43

3.2 常用的過(guò)程指標(biāo) ····················· 48

3.3 Performance API 詳解 ··············· 51

3.4 分階段性能分析 ···················· 58

3.5 小結(jié) ································· 59

第 4 章 實(shí)驗(yàn) ································· 60

4.1 優(yōu)化不是照搬軍規(guī) ·················· 61

4.2 用實(shí)驗(yàn)驗(yàn)證優(yōu)化 ···················· 63

4.3 用實(shí)驗(yàn)改進(jìn)優(yōu)化 ···················· 69

4.4 小結(jié) ································· 71

第 5 章 工具 ································· 72

5.1 DevTools ···························· 73

5.2 WebPageTest ························ 81

5.3 小結(jié) ································· 87

第 3 篇 網(wǎng)絡(luò)協(xié)議與性能

第 6 章 TTFB 為什么這么長(zhǎng) ··············· 90

6.1 TTFB 的合理值 ····················· 91

6.2 如何優(yōu)化 TTFB ····················· 95

6.3 小結(jié) ·································· 99

第 7 章 建立連接為什么這么慢 ·········· 100

7.1 建立連接應(yīng)該耗時(shí)多久 ············ 101

7.2 如何優(yōu)化建立連接的耗時(shí) ········· 103

7.3 小結(jié) ································ 105

第 8 章 Fetch 之前瀏覽器在干什么 ····· 106

8.1 重定向 ······························ 107

8.2 瀏覽器打開(kāi)耗時(shí) ··················· 112

8.3 如何優(yōu)化 beforeFetch 耗時(shí) ········ 114

8.4 小結(jié) ································ 117

第 9 章 HTTPS 協(xié)議比 HTTP 協(xié)議

9.1 HTTPS 協(xié)議為什么安全 ··········· 119

9.2 HTTPS 協(xié)議如何吊銷證書 ········· 125

9.3 HTTPS 協(xié)議更慢嗎 ················ 129

9.4 小結(jié) ································· 130

第 10 章 HTTP/2、HTTP/3 和性能 ······ 131

10.1 HTTP/2 和性能 ···················· 131

10.2 為什么還需要 HTTP/3 ············ 144

10.3 小結(jié) ······························· 148

第 11 章 壓縮和緩存 ······················ 150

11.1 傳輸速度和壓縮速度如何兼得 ···· 151

11.2 HTTP 緩存什么時(shí)候會(huì)失效 ······ 154

11.3 小結(jié) ······························· 157

第 4 篇 瀏覽器與性能

第 12 章 瀏覽器和性能 ···················· 160

12.1 **次渲染時(shí)都發(fā)生了什么 ····· 161

12.2 為什么 DOM 操作很慢 ··········· 168

12.3 小結(jié) ······························· 172

第 13 章 異步任務(wù)和性能 ················· 173

13.1 事件循環(huán)機(jī)制 ····················· 174

13.2 宏任務(wù)和微任務(wù) ·················· 176

13.3 Promise 的 polyfill 性能 ··········· 178

13.4 requestAnimationFrame ··········· 180

13.5 小結(jié) ······························· 181

第 14 章 內(nèi)存為什么會(huì)影響性能 ········· 182

14.1 內(nèi)存 ······························· 182

14.2 內(nèi)存泄漏 ·························· 188

14.3 小結(jié) ······························· 191

第 15 章 使用 ServiceWorker 改善

15.1 ServiceWorker 概述 ··············· 194

15.2 使用 ServiceWorker 進(jìn)行緩存 ···· 196

15.3 API 提前加載 ····················· 204

15.4 ServiceWorker 冷啟動(dòng) ············ 205

15.5 小結(jié) ······························· 207

第 16 章 字體對(duì)性能的影響 ·············· 208

16.1 字體導(dǎo)致的布局偏移 ············· 208

16.2 如何避免字體帶來(lái)的布局偏移 ···· 210

16.3 小結(jié) ······························· 214

第 5 篇 前端工程與性能

第 17 章 構(gòu)建工具和性能 ················· 218

17.1 為什么需要打包 ·················· 219

17.2 構(gòu)建工具可以做什么 ············· 226

17.3 小結(jié) ······························· 237

第 18 章 服務(wù)器端渲染和性能 ··········· 239

18.1 SSR 和同構(gòu) ······················· 241

18.2 SSR 的性能優(yōu)化 ·················· 241

18.3 小結(jié) ······························· 246

第 6 篇 跨端技術(shù)與 CDN

第 19 章 WebView 和性能 ················ 248

19.1 WebView 和 Native 的區(qū)別 ······· 249

19.2 WebView 的通信成本 ············ 254

19.3 React Native 的懶加載有何

19.4 React Native 如何減小打包

19.5 API 并行請(qǐng)求 ····················· 271

19.6 小結(jié) ······························· 274

第 20 章 CDN 和性能 ····················· 275

20.1 什么是 CDN ······················· 275

20.2 如何提升緩存命中率 ············· 278

20.3 動(dòng)態(tài)加速 ·························· 281

20.4 自動(dòng) polyfill ······················· 284

20.5 邊緣計(jì)算和性能 ·················· 288

20.6 小結(jié) ······························· 291


展開(kāi)全部

前端性能揭秘 作者簡(jiǎn)介

佘錦鑫,花名當(dāng)軒。畢業(yè)于江南大學(xué)理學(xué)院,阿里巴巴前前端技術(shù)專家,曾負(fù)責(zé)阿里巴巴國(guó)際站性能優(yōu)化,講師、開(kāi)源愛(ài)好者,F(xiàn)就職于網(wǎng)易云音樂(lè),對(duì)Web性能、跨端、可視化搭建等領(lǐng)域有較深入的理解。

商品評(píng)論(0條)
暫無(wú)評(píng)論……
書友推薦
本類暢銷
編輯推薦
返回頂部
中圖網(wǎng)
在線客服