zoukankan      html  css  js  c++  java
  • 合并css 合并图片 合并js

    1:合并css

     

    如:index.html 中的代码

      

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Document</title>
                <link rel="stylesheet" href="css/main.css">

             //在index.html中只引入一个main.css文件,其他的css文件使用@import url('样式文件路径');引入到main.css文件头部
             如:main.css文件中的代码

                @import url(one.css);

                @import url(tow.css);

    </head>
    <body>
    <div id="box">hello</div>

     合并css的优缺点:

    1:

    好处是,把多个样式表导入到一个样式表中,在页面里面只需要导入一个样式表即可,可以减少在页面中引入的外部css文件,减少http请求
    缺点:
    1  兼容性的差异。由于@import是CSS2.1提议的因而老的阅读器(ie5以下)不支持,@import只有在IE5以上的才力辨认。
    2  应用dom控制样式时的差异。当应用javascript控制dom去转变样式的时间,只能应用link标签,由于@import不是dom可以控制的(经测试没发现问题)

    <script src="js/1.js"></script>
    </body>
    </html>

     --------------------------------------------------------------------合并js文件--------------------------------------------------

    合并成一个文件下载,就不能充分利用浏览器多线程并行下载的好处了。

    假设有100个JS文件,每个1M,如何下载更快?
    1)合并成一个100M的文件让浏览器下载难道不会阻塞吗?
    2)生成100个虚拟域名:static0.your.com~static99.your.com
    浏览器会开大量线程同时下载,100个文件就能成功下载完成

    可见,多域名下载的性能提升是远远高于减少请求的。性能优化时,应关注高优先级的优化项;低优先的优化手段需要配合高优先的。不是简单的说,压成一个文件就一定会快的——与其这样,还不如将所有(CSS+JS+Img)流直接写 到HTML,更快呢(但也完全放弃多线程下载)。

    合并js文件的常用方法:

    1; 使用require.js 模块化按需加载js文件;

    2:使用js项目构建工具Grunt  ||YCombo 介绍

     

  • 相关阅读:
    标识符
    注释
    关键字
    第一个JAVA程序
    JAVA运行机制
    每个程序员都应该知道的延迟数
    构建WebDriverAgent时报错“xxx: no identity found Command CodeSign failed with a nonzero exit code”解决办法
    执行 sh ./Scripts/bootstrap.sh -d 时提示“xcrun: error: unable to find utility “simctl”, not a developer tool or in PATH ”错误解决办法
    stf ios版本部署
    centos 7安装一机多控stf客户端
  • 原文地址:https://www.cnblogs.com/huangshikun/p/7028339.html
Copyright © 2011-2022 走看看