Front-end performance optimization list:

  1. JS

  • Reduce DOM manipulation

  • preload

  • Lazy loading

  • tree shaking

  • Anti-shake, throttling

  • Variable cache

  • For traversal takes precedence

  • Interface data lazy request

  1. CSS

  • Reduce the class hierarchy

  • Hardware acceleration (3D Canvas WebGL)

  • Sprite figure

  • Avoid using filters

  1. html
  • Reduce invalid labels
  1. As a whole

  • Reduce the number of HTTP requests (empty SRC HTTP)

  • keep-alive

  • CDN content distribution

  • Gzip compression

  • Js CSS merge compression, image compression

  • Reduce cookie size

  • Use caching wisely

  • Js CSS position to avoid blocking

Welcome to the front end learning punch group learning ~ 516913974