每天一道前端面试题:如何进行网站性能优化

陶应
• 阅读 155
  • content方面

    • 减少HTTP请求:合并文件、CSS精灵、inline Image
    • 减少DNS查询:DNS缓存、将资源分布到恰当数量的主机名
    • 减少DOM元素数量
  • Server方面

    • 使用CDN
    • 配置ETag
    • 对组件使用Gzip压缩
  • Cookie方面

    • 减小cookie大小
  • css方面

    • 将样式表放到页面顶部
    • 不使用CSS表达式
    • 使用<link>不使用@import
  • Javascript 方面

    • 将脚本放到页面底部
    • javascriptcss从外部引入
    • 压缩JavaScriptcss
    • 删除不需要的脚本
    • 减少DOM访问
  • 图片方面

    • 优化图片:根据实际颜色需要选择色深、压缩
    • 优化css精灵
    • 不要在 HTML 中拉伸图片

推荐:

每天一道前端面试题:如何进行网站性能优化

点赞
收藏
评论区
推荐文章
虾米大王 虾米大王
2年前
java代码092
code092.jsp通过FindServlet类查询分页数据所有图书信息ID图书名称价格数量作者<%Listlist1(List)request.getAttribute("list");for(code089book:list1)%
虾米大王 虾米大王
2年前
java代码099
code099.jspInserttitlehere$pageScope.user.name
虾米大王 虾米大王
2年前
java代码073
code073.javapackagepack02;importjava.io.IOException;importjava.io.PrintWriter;importjava.util.UUID;importjavax.servlet.ServletException;importjavax.servlet.annotation.Multip
虾米大王 虾米大王
2年前
java代码042
code042.javapackagepack01;publicclasscode042privateStringname;privatedoubleprice;privateintcount;privateStringfactory;publicStringgetName()returnthis.name;
Wesley13 Wesley13
3年前
JAVA_将二进制流转换成图片文件
_1. __\代码\_将二进制流转换成图片文件晚风工作室www.soservers.com    _跳至\1\(http://www.oschina.net/code/snippet_931591_1760429253)\全屏预览\(http://www.oschina.net/code/piece_full?code17
Wesley13 Wesley13
3年前
VSCode配置FiraCode和更纱黑体字体
!(https://oscimg.oschina.net/oscnet/c7bb62d935ceb01d3b7fe176322e84ae00d.png)Fira Code下载到FiraCode字体的GitHub(https://www.oschina.net/action/GoToLink?urlhttps%
Stella981 Stella981
3年前
Linux自动检测网站心跳通知shell脚本
!/bin/bashLIST("http://xxxx.com")NAME("评价系统getwindowList接口")for((i0;i<${LIST@};i))doHTTP_CODEcurlo/dev/nullsw"%{http_code}""${LIST
Wesley13 Wesley13
3年前
ORACLE纯SQL实现多行合并一行
项目中遇到一个需求,需要将多行合并为一行。表结构如下:NAME                           Null          Type\    N\_SEC\_CODE                NOTNULL CHAR(6
Wesley13 Wesley13
3年前
Oracle:Pivot 转多列并包含多个名称
SELECTFROM(SELECTl.DISTRIBUTOR_ID,d.SKU_CODE,d.WH_CODE,d.ORDER_PACKAGES,d.PRICE,d.YEARLY||d.MONTHLYasYM,d
飞鹅官方账号 飞鹅官方账号
10个月前
五、飞鹅官网API接口文档
接口列表1.获取网站信息请求方法:GET请求URL:/api/site/getSiteInfo请求参数无返回结果json"code":1,"data":"id":1,//id"title":"SampleSiteName",//网站名称"intro":"T
美凌格栋栋酱 美凌格栋栋酱
5个月前
Oracle 分组与拼接字符串同时使用
SELECTT.,ROWNUMIDFROM(SELECTT.EMPLID,T.NAME,T.BU,T.REALDEPART,T.FORMATDATE,SUM(T.S0)S0,MAX(UPDATETIME)CREATETIME,LISTAGG(TOCHAR(