首页
AI Coding
沸点
课程
直播
活动
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
登录
注册
确定删除此收藏集吗
删除后此收藏集将被移除
取消
确定删除
确定删除此文章吗
删除后此文章将被从当前收藏集中移除
取消
确定删除
编辑收藏集
名称:
描述:
0
/100
公开
当其他人关注此收藏集后不可再更改为隐私
隐私
仅自己可见此收藏集
取消
确定
性能优化系列
订阅
_宅_宅_
更多收藏集
微信扫码分享
微信
新浪微博
QQ
15篇文章 · 0订阅
[贝聊科技]首屏视频的优化过程(补充moov的研究)
我司的官网首页——贝聊官网,首屏有一个自动播放的背景视频,一直被诟病视频加载慢、播放卡。刚开始以为是文件太大,或者是网速太慢,但当我去优化它的时候,发现并没有预想的简单。本文记录了优化过程和经验总结,希望能对读者有所帮助。 官网的首页由6屏组成,首屏主要内容是一个自动循环播放的…
提升90%加载速度——vuecli下的首屏性能优化
前言之前用vuecli做了个博客,是一个单页面项目,大概有十个路由直接npmrunbuild打包出来,有一个1M的巨大js文件先挂载到服务器上试试好家伙这加载时间仿佛过了半个世纪首屏页面整整加载了9s
一次PC商城首屏优化的总结
最近花了一些时间对我们公司PC端首页首屏做了一次优化。下面是最终优化后的加载速度(禁止谷歌浏览器缓存情况下) 本胖还记得之前掘金热门推荐了一篇名为 性能优化只有3步,你了解吗,里面总结了3种方法,本胖感觉很好哈。第一种就是关键资源字节数,第二种是关键资源连接数,3.关键渲染路径…
vue客户端渲染首屏优化之道
1、 dll动态链接库, 使用DllPlugin DllReferencePlugin,将第三方库提取出来另外打包出来,然后动态引入html。可以提高打包速度和缓存第三方库 主要是分离 第三方库,自定义模块(引入超过3次的自定义模块被分离),webpack运行代码(runtim…
Vue首屏加载速度优化,提升80%以上
1. 首先安装webpack的可视化资源分析工具,命令行执行: 2. 然后在webpack的dev开发模式配置中,引入插件,代码如下: 3. 最后命令行执行npm run build --report , 浏览器会自动打开分析结果,如下所示: 可以看到vue全家桶相关依赖占用了…
移动spa商城优化记(一)---首屏优化篇
随着公司业务的不断壮大,最近老是有用户反应公司APP内的商城打开比较慢,这可不行啊,慢了容易流失用户,流失用户减少公司业绩,公司业绩少我的年终奖就少…………,所以为了公司,也为了自己,开始优化之路。 商城系统是去年开发的,是一个基于vue2.0的spa项目,最好的优化思路当然是…
Vue SPA 首屏加载优化实践
我们以 vue-cli 工具为例,使用 vue-router 搭建SPA应用,UI框架选用 element-ui , ajax方案选用 axios, 并引入 vuex ,使用 vuex-router-sync 将 router 同步到 store ,服务器使用本地Nginx服务…
网页首屏性能优化总结
作为一名前端工程师,网页首屏性能优化是一个绕不开的话题。最近这段时间我做了一些首屏性能优化的项目,这里做一个小小的总结。 网页是运行在浏览器端的,优化网页性能无法脱离浏览器。所以首先需要搞清楚浏览器加载一个网页的过程。最经典、常见的一个问题就是:从输入Url到网页呈现在用户面前…
Vue SPA 首屏优化实战
常规 vue 项目打包后访问,返回一个只包含 div 的 html,其他内容块都是通过 js 动态生成的。 1. 路由文件中按需引入组件 2. 静态库按需引入模块,而不是全部 1. css、js 放置顺序 2. 使用字体图标,icon 资源使用雪碧图 拆分入口 chunk 文件…