前端性能优化小结
一个老生常谈的问题,算是一项任重而道远的工程,总的来看优化范围很广,但我们可以从单个点逐步切入,养成自动代入优化思维才是目的,这里只做简单记录一下。 问题方案 切入主题,综合资料总的来看,一般直接造成页面卡顿的原因主要有 大批量dom操作、无限制......
一个老生常谈的问题,算是一项任重而道远的工程,总的来看优化范围很广,但我们可以从单个点逐步切入,养成自动代入优化思维才是目的,这里只做简单记录一下。 问题方案 切入主题,综合资料总的来看,一般直接造成页面卡顿的原因主要有 大批量dom操作、无限制......
很久没写过博客更新内容了,不过都有在更新的,前不久把服务端的后端 php 性能配置优化了一下(启用memcached、opcache缓存扩展,设置4G并发方案,memory_limit为256m,linux 启用 2G swap 虚拟内存等),感觉还是很有效果。这两天顺便把之前的图片懒加载也给重新安排上了(取消了 lazyload.js 的 jquery 依赖),之前只应用在文章中,现在全站开启,首屏加载效果的确比以前要快很多(尤其是漫游影视这种单页面多图片的,再加上php缓存后,加载速度效果卓越),主要很多页面减少了大量评论表情包请求,这种时候 lazyload 的确有必要。适配完成后已将版本更新到 github 。
在本地 lighthouse 评估测试中(PC端,移动端普遍下浮),除漫游影视主页面(多图片请求)及归档页面(大量sql请求)的 Performance 评分在 80-90 之间浮动外,其他页面均在 95-10 0之间,基本能实现秒开。测试 lighthouse 期间,顺便优化里其中的其他几项评分标准(Accessibility、Best practices、SEO),主要还是一些 seo 的东西(评论图片 alt 优化暂时搁置)。
在测试可访问性(Accessibility)栏目中的 CONTRAST 中有一条:Background and foreground colors do not have a sufficient contrast ratio.
也就是页面对比度不够,可能对视觉障碍用户有影响,这个也有很多博友提到过。还有字体大小,以后再慢慢优化吧。
其实优化网站速度还是挺有必要的,以前基本都只是套个cdn,优化代码逻辑而已,其实优化后端还是蛮有必要的,毕竟依赖后端数据支持。
2023年1月11日 - 性能优化