web性能优化
web网络层、前端、后端、数据库性能优化
web性能优化
-
vue webpack性能优化（一） 准备分析工作
web性能优化一.了解vue-cli项目的配置
1.查看vue-cli版本是在package.json中查看
2.查看webpack版本是在node_modules/webpack/package.json中查看
二.查看编译耗时
2.1 手动统计耗时
vue编译命令npm run build，其实际使用的命令是vue-cli-service build，路径是node_modules\@vue\cli-service\lib\commands\build\index.js
原108行加入命令：
const beginTime = Date.now()
原209~210行之间加入代码：
const endTime = Date.now()
info(`编译耗时：${chalk.cyan((endTime - beginTime) / 1000)}(s)`)
npm run build即可看出编译总耗时
2.2 使用第三方工具（推荐）
speed-measure-webpack-plugin每一项耗时都有精确统计，搭配使用webpack-bundle-analyzer打包后的各个模块文件大小，直观明了，根据具体项目再去进行优化。
阅读更多
风口下的猪2023-04-06发表在【web性能优化】 -
时间复杂度和时间规模函数（执行次数）
web性能优化时间复杂度是判断代码执行性能的一个重要指标
场景1：T（n） = 3n，执行次数是线性的。
void eat1(int n){
for(int i=0; i<n; i++){;
System.out.println("等待一天");
System.out.println("等待一天");
System.out.println("吃一寸面包");
}
}场景2：T（n） = 5logn，执行次数是对数的。
void eat2(int n){
for(int i=1; i<n; i*=2){
System.out.println("等待一天");
System.out.println("等待一天");
System.out.println("等待一天");
System.out.println("等待一天");
System.out.println("吃一半面包");
}
}场景3：T（n） = 2，执行次数是常量的。
void eat3(int n){
System.out.println("等待一天");
System.out.println("吃一个鸡腿");
}场景4：T（n） = 0.5n^2 + 0.5n，执行次数是一个多项式。
void eat4(int n){
for(int i=0; i<n; i++){
for(int j=0; j<i; j++){
System.out.println("等待一天");
}
System.out.println("吃一寸面包");
}
}
阅读更多风口下的猪2022-03-05发表在【web性能优化】 -
如果是MySQL引起的CPU消耗过大，你会如何优化？
web性能优化
阅读更多风口下的猪2020-07-15发表在【web性能优化】 -
创建多少个线程合适？
web性能优化
阅读更多风口下的猪2020-07-15发表在【web性能优化】 -
前端渲染与后端渲染的区别
web性能优化前端渲染：
指的是后端返回JSON数据，前端利用预先写的html模板，循环读取JSON数据，拼接字符串（es6的模板字符串特性大大减少了拼接字符串的的成本），并插入页面。
# 好处：网络传输数据量小。不占用服务端运算资源（解析模板），模板在前端（很有可能仅部分在前端），改结构变交互都前端自己来了，改完自己调就行。
# 坏处：前端耗时较多，对前端工作人员水平要求相对较高。前端代码较多，因为部分以前在后台处理的交互逻辑交给了前端处理。占用少部分客户端运算资源用于解析模板。
后端渲染：
前端请求，后端用后台模板引擎直接生成html，前端接受到数据之后，直接插入页面。
# 好处：前端耗时少，即减少了首屏时间，模板统一在后端。前端（相对）省事，不占用客户端运算资源（解析模板）
# 坏处：占用服务器资源。
前端渲染与后端渲染对比：
（一）后端渲染：
# 页面呈现速度：快，受限于用户的带宽
# 流量消耗：少一点点（可以省去前端框架部分的代码）
# 可维护性：差（前后端东西放一起，掐架多年，早就在闹分手啦）
# seo友好度：好
# 编码效率：低（这个跟不同的团队不同，可能不对）
（二）前端渲染：
# 页面呈现速度：主要受限于带宽和客户端机器的好坏，优化的好，可以逐步动态展开内容，感觉上会更快一点。
# 流量消耗：多一点点（一个前端框架大概50KB）当然，有的用后端渲染的项目前端部分也有在用框架。
# 可维护性：好，前后端分离，各施其职，代码一目明了。
# SEO友好度：差，大量使用ajax，多数浏览器不能抓取ajax数据。
# 编码效率：高，前后端各自只做自己擅长的东西，后端最后只输出接口，不用管页面呈现，只要前后端人员能力不错，效率不会低。
阅读更多风口下的猪2020-03-05发表在【web性能优化】
