前端知識匯總

自動化構(gòu)建工具

包管理工具

模塊打包工具

腳本語言

模塊加載規(guī)范

消息推送技術(shù)

  • Comet
    • Long polling
      • XHR long polling
      • Script tag long polling
    • Streaming
      • Hidden iframe with "Chunked Transfer Encoding"
      • XHR onreadystatechange
  • Server-Sent Events
  • WebSocket
  • Flash XMLSocket

前端框架

  • Backbone.js（MVC）
  • Angular.js（MVVM）
  • Ember.js（MVVM）
  • Vue.js（MVVM）
  • React.js
  • Redux
  • Bootstrap

Javascript 工具庫

  • jQuery
  • Underscore.js
  • Zepto.js
  • lodash

CSS 相關(guān)

  • LESS
  • SASS
  • Bootstrap
  • Pure

跨域解決方案

  • JSONP
  • CORS
  • <iframe> 設(shè)置 document.domain 實現(xiàn)下級域名與上級域名交互
  • window.postMessage

網(wǎng)頁優(yōu)化

  • HTTP/2
  • Sprite
  • 圖片延遲加載
  • 腳本加載優(yōu)化（加載腳本會阻塞渲染）
    • Inline script
    • </body> 標(biāo)簽底部加載
    • <script async>：缺點是不能實現(xiàn)加載順序依賴
    • AMD
  • CSS加載優(yōu)化（加載CSS樣式表會阻塞渲染）
    • Inline style
    • 延遲加載或異步加載
  • HTML加載優(yōu)化
    • Bigrender：頁面一次加載全部數(shù)據(jù)，但先渲染首屏，頁面滾動觸發(fā)渲染后續(xù)內(nèi)容
    • Bigpipe：通過"Chunked Transfer Encoding"方式，先返回網(wǎng)頁結(jié)構(gòu)，后返回數(shù)據(jù)，通過腳本將渲染內(nèi)容
    • Lazyrender：頁面一次加載部分?jǐn)?shù)據(jù)進行渲染，頁面滾動后加載后續(xù)的數(shù)據(jù)并渲染

頁面布局

  • Flexbox
  • Grid Layout
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容