前端知識集錦

時間 2019-11-05

標籤前端知識集錦简体版

原文原文鏈接

目前本身組建的一個團隊正在寫一份面試圖譜，將會在七月中旬開源。內容十分豐富，初版會開源前端方面知識和程序員必備知識，後期會逐步寫入後端方面知識。由於工程所涉及內容太多（目前已經寫了一個半月），而且還需翻譯成英文，因此所需時間較長。有興趣的同窗能夠 Follow 個人 Github 獲得最快的更新消息。html

JS 相關

CSS 相關

z-index深刻理解
height、min-height 問題

<style>
.parent{
	min-height: 300px;
    // height: 1px;
}
.child{
	height: 100%;
	background: red;
}
</style>

<div class="parent">
    <div class="child">1</div>
</div>
複製代碼

Demo 地址前端

以上狀況如何是 child 元素撐滿父級元素：答案是給 parent一個具體高度 height：1pxnode

性能相關

圖片加載優化

從三方面來講git

圖片相關
- 圖片格式 webP
- 根據屏幕大小裁剪圖片尺寸
圖片加載相關
- 首先加載首屏圖片再加載別的
- 懶加載
- 預加載
網絡相關
- HTTP/2 多路複用
  - Web性能優化與HTTP/2
  - http2-explained
- 使用 cdn
- 對於不升級的 HTTP 版原本說加載慢的緣由
  - 每個鏈接須要3次握手，RTT 須要時間
  - 慢啓動