vue优化记录

Posted on Edited on

1.看别人怎么优化的
2.看chrome提示怎么优化

1
2
3
4
5
6
7
8
9
10
11
12
13
14
const ImageminPlugin = require('imagemin-webpack-plugin').default
const imageminMozjpeg = require('imagemin-mozjpeg')

// 图片优化
new ImageminPlugin({
  test: /\.(jpe?g|png|gif)$/i,
  plugins: [
    imageminMozjpeg({
      disable: process.env.NODE_ENV !== 'production',
      quality: '65-80',
      progressive: true
    })
  ]
})

提取 CSS 到单个文件-简单的方法

首页

performance 30
Accessibility 78
BestPractices 79
SEO 100

performance

performance 30!

Serve images in next-gen formats

Image formats like JPEG 2000, JPEG XR, and WebP often provide better compression than PNG or JPEG, which means faster downloads and less data consumption. Learn more.

修改了png, 使用webp 利用photoshop插件保存图片

performance 35!

Serve images in next-gen formats(不提示)

但是由于兼容问题, 这里炸了 哈哈哈哈哈哈哈哈😂

… 等待后续