合并压缩css和Js的方式( 转载）

最新推荐文章于 2022-08-31 13:17:22 发布
最新推荐文章于 2022-08-31 13:17:22 发布
阅读量709 收藏
点赞数
文章标签： php java 前端 ViewUI
原文链接：http://www.cnblogs.com/doubilaile/p/8432684.html
版权

[文章作者：磨延城 转载请注明原文出处： https://mo2g.com/view/74/ ]

本篇博客从减少浏览器加载外部资源连接数的思考角度着手,要想深入了解其他加快网页显示速度的原理,估计又得花不少时间,这需要把前端跟后端都说解释清楚.有时间我会分开写其他部分的内容.这里为了节省时间,只介绍如何减少网页需要加载的外部资源,加快浏览器的响应速度.

本篇博客从减少浏览器加载外部资源连接数的思考角度着手，要想深入了解其他加快网页显示速度的原理，估计又得花不少时间，这需要把前端跟后端都说解释清楚。有时间我会分开写其他部分的内容。这里为了节省时间，只介绍如何减少网页需要加载的外部资源，加快浏览器的响应速度。

如果一个页面比较复杂，要展示的内容 比较多，就会包含很多外部资源、css样式还有js脚本，比如某个门户网站的的html代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
< html >
< head >
     < meta  http-equiv = "Content-Type"  content = "text/html; charset=utf-8" />
     < title >XXX最大的门户网站</ title >
     <!-- 外部css样式资源 开始-->
     < link  type = "text/css"  rel = "stylesheet"  href = "1.css" />
     < link  type = "text/css"  rel = "stylesheet"  href = "2.css" />
     ...
     < link  type = "text/css"  rel = "stylesheet"  href = "n-1.css" />
     < link  type = "text/css"  rel = "stylesheet"  href = "n.css" />
     <!-- 外部css样式资源 结束-->
</ head >
< body >
 
<!-- 页面展示图片 开始-->
< img  src = "1.jpg" >
...
< img  src = "n.jpg" >
<!-- 页面展示图片 结束-->
 
<!-- 外部js脚本资源 开始-->
< script  scr = "1.js" ></ script >
...
< script  scr = "n.js" ></ script >
<!-- 外部js脚本资源 结束-->
</ body >
</ html >

这些大型门户网站一个页面需要加载的外部资源总数，经常超过100个。腾讯QQ首页，就加载高达了192个外部资源。相信这个数字是经过腾讯的前端团队尽了最大努力才压缩下来的结果，如果没做过处理，会怎样？

请看下边的表格，分别显示了各个浏览器在同一时间，能向同一域名请求的最大并发连接数。

浏览器HTTP 1.1HTTP 1.0
IE 6、7、82~64~6
Firefox2~66~8
Safari44
Chrome4~64~6

如果浏览器支持8个并发链接，每个外部资源加载时间为400ms，那么160个外部资源连接，理论上就需要8000ms（160 ÷ 8 × 400）的加载时间，大约8秒才能显示完整的页面。但实际的情况更加复杂，最基本的问题就是要加载的外部资源数据包的大小，这一因素直接影响了加载时间，要想保证每个外部资源的加载时间为400ms或者更短的时间，这又牵扯到CDN分布式存储。所以，在资金不足的情况下，我们能做的就是减少外部资源的连接数，还有就是精简和压缩静态数据。

为了解决这一问题，我为mPHP核心框架写了一个PHP函数file_merger，用来合并多个CSS样式文件或者JS脚本文件，并对生成的合成文件进行压缩，从而更进一步的减小外部资源的数据大小。

使用环境如下：

测试环境地址：http://localhost/

测试环境目录结构：

/static/css/，css样式目录存在1.css，2.css两个文件

/static/js/，js脚本目录下存在1.js，2.js

/static/merger/，合成文件保存目录

file_merger函数的使用例子如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<?php
include  'file_merger.php' ;
$CFG [ 'debug' ] = 0; //当值为1的时候，不进行合并压缩，按常规调用
$CFG [ 'java' ] = 0; //当值为1的时候，使用yuicompressor压缩；0使用PHP正则表达式简单压缩
$arrCss [] =  '1.css' ;
$arrCss [] =  '2.css' ;
$arrJs [] =  '1.js' ;
$arrJs [] =  '2.js' ;
$css  = file_merger( $arrCss , 'main.css' );
$js  = file_merger( $arrJs , 'main.js' );
echo  $css ;
echo  $js ;
/*
函数执行成功后，会在指定的合成文件保存目录生成main.css，main.js两个文件，并会输出结果如下
<link rel="stylesheet" type="text/css" href="http://localhost/static/merger/main.css?1389454147">
<script type="text/javascript" src="http://localhost/static/merger/main.js?1389454147"></script>
 
测试代码的时候可以把$CFG['debug']设置为1;
当为1的时候，不会生成合成文件，同时会得到如下输出结果，方便调试：
<link href="http://localhost/static/css/1.css?1389454824" rel="stylesheet" type="text/css">
<link href="http://localhost/static/css/2.css?1389454824" rel="stylesheet" type="text/css">
<script type="text/javascript" src="http://localhost/static/js/1.js?1389454824"></script>
<script type="text/javascript" src="http://localhost/static/js/2.js?1389454824"></script>
*/

file_merger有两种压缩方式，一种是使用雅虎基于java开发的yuicompressor，第二种就是我基于PHP正则表达式编写的压缩规则。优先推荐使用yuicompressor的压缩方式，但如果你的服务器环境不支持java，也可以使用第二种方法。

下边是file_merger函数的实现代码，如果使用过程中有什么问题，可以给我留言。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<?php
/*
作者:moyancheng
最后更新时间:2013-05-17
最后更新时间:2013-12-13
功能：将多个js或css，合并为一个js或css，并进行压缩
$arrPath:合并文件数组
$out:输出文件
$cache:是否缓存，默认为false,会在文件名后边加上时间戳，如main.js?1389424132
*/
function  file_merger( $arrFile , $out , $cache =false) {
     global  $CFG ;
     $url  =  'http://localhost/static/' ;//静态资源url地址，根据自己的情况修改
     $static  =  '/static/' ; //静态资源在服务器上的存储路径，根据自己的情况修改
     $dir  =  "{$static}merger/" ; //合成文件在服务器上的存储路径，根据自己的情况修改
     $return  =  "{$url}merger/{$out}" ;
     $out  =  "{$dir}{$out}" ; //
     $time  =  $_SERVER [ 'REQUEST_TIME' ];
     
     if (  substr ( $arrFile [0],-2) ==  'js'  ) {
          $type  =  'js' ;
     }  elseif (  substr ( $arrFile [0],-3) ==  'css'  ) {
         $type  =  'css' ;
     }
     
     //当文件不存在,或者调试模式,就执行下边的程序
     if ( ! is_file ( $out ) ||  $CFG [ 'debug' ]) {
         //调试模式,按常规加载js,css
         if (  $CFG [ 'debug' ] ) {
             $out  =  '' ;
             foreach ( $arrFile  as  $key  =>  $file ) {
                 if (  $type  ==  'js'  ) {
                     $out  .=  "<script type=\"text/javascript\" src=\"{$url}js/{$file}?{$time}\"></script>\n" ;
                 }  elseif (  $type  ==  'css'  ) {
                     $out  .=  "<link href=\"{$url}css/{$file}?{$time}\" rel=\"stylesheet\" type=\"text/css\">\n" ;
                 }
             }
             return  $out ;
         }  else  {
         //正式环境启动压缩
             ob_start();
             foreach ( $arrFile  as  $key  =>  $file ) {
                 include  $static . "{$type}/{$file}" ;
             }
             $str  =  ob_get_clean();
             $tmp  =  $dir .  'tmp' ;
             
             if ( $CFG [ 'java' ]) {
                 //java程序精简文件
                 file_put_contents ( $tmp , $str );
                 if (  $type  ==  'js'  ) {
                     $exec  =  "java -jar {$static}yuicompressor-2.4.2.jar --type js --charset utf-8 -v $tmp > $out" ; //压缩JS
                 }  elseif (  $type  ==  'css'  ) {
                      $exec  =  "java -jar {$static}yuicompressor-2.4.2.jar --type css --charset utf-8 -v $tmp > $out" ; //压缩CSS
                 }
                 ` $exec ` ;
             }  else  {
                 //php程序精简文件
                 $str  = preg_replace(  '#/\*.+?\*/#s' , '' ,  $str  ); //过滤注释 /* */
                 $str  = preg_replace(  '#(?<!http:)(?<!\\\\)(?<!\')(?<!")//(?<!\')(?<!").*\n#' , '' ,  $str  );//过滤注释 //
                 $str  = preg_replace(  '#[\n\r\t]+#' , ' ' ,  $str  ); //回车 tab替换成空格
                 $str  = preg_replace(  '#\s{2,}#' , ' ' ,  $str  ); //两个以上空格合并为一个
                 file_put_contents ( $out , $str );
             }
         }
     }
     unset( $CFG );
     if (  $cache  ) {
         if (  $type  ==  'js'  )  return  "<script type=\"text/javascript\" src=\"{$return}\"></script>\n" ;
         elseif (  $type  ==  'css'  )  return  "<link rel=\"stylesheet\" type=\"text/css\" href=\"{$return}\">\n" ;
     }  else  {
         if (  $type  ==  'js'  )  return  "<script type=\"text/javascript\" src=\"{$return}?{$time}\"></script>\n" ;
         elseif (  $type  ==  'css'  )  return  "<link rel=\"stylesheet\" type=\"text/css\" href=\"{$return}?{$time}\">\n" ;
     }
}

[文章作者：磨延城 转载请注明原文出处： https://mo2g.com/view/74/ ]

本篇博客从减少浏览器加载外部资源连接数的思考角度着手,要想深入了解其他加快网页显示速度的原理,估计又得花不少时间,这需要把前端跟后端都说解释清楚.有时间我会分开写其他部分的内容.这里为了节省时间,只介绍如何减少网页需要加载的外部资源,加快浏览器的响应速度.

本篇博客从减少浏览器加载外部资源连接数的思考角度着手，要想深入了解其他加快网页显示速度的原理，估计又得花不少时间，这需要把前端跟后端都说解释清楚。有时间我会分开写其他部分的内容。这里为了节省时间，只介绍如何减少网页需要加载的外部资源，加快浏览器的响应速度。

如果一个页面比较复杂，要展示的内容 比较多，就会包含很多外部资源、css样式还有js脚本，比如某个门户网站的的html代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
< html >
< head >
     < meta  http-equiv = "Content-Type"  content = "text/html; charset=utf-8" />
     < title >XXX最大的门户网站</ title >
     <!-- 外部css样式资源 开始-->
     < link  type = "text/css"  rel = "stylesheet"  href = "1.css" />
     < link  type = "text/css"  rel = "stylesheet"  href = "2.css" />
     ...
     < link  type = "text/css"  rel = "stylesheet"  href = "n-1.css" />
     < link  type = "text/css"  rel = "stylesheet"  href = "n.css" />
     <!-- 外部css样式资源 结束-->
</ head >
< body >
 
<!-- 页面展示图片 开始-->
< img  src = "1.jpg" >
...
< img  src = "n.jpg" >
<!-- 页面展示图片 结束-->
 
<!-- 外部js脚本资源 开始-->
< script  scr = "1.js" ></ script >
...
< script  scr = "n.js" ></ script >
<!-- 外部js脚本资源 结束-->
</ body >
</ html >

这些大型门户网站一个页面需要加载的外部资源总数，经常超过100个。腾讯QQ首页，就加载高达了192个外部资源。相信这个数字是经过腾讯的前端团队尽了最大努力才压缩下来的结果，如果没做过处理，会怎样？

请看下边的表格，分别显示了各个浏览器在同一时间，能向同一域名请求的最大并发连接数。

浏览器HTTP 1.1HTTP 1.0
IE 6、7、82~64~6
Firefox2~66~8
Safari44
Chrome4~64~6

如果浏览器支持8个并发链接，每个外部资源加载时间为400ms，那么160个外部资源连接，理论上就需要8000ms（160 ÷ 8 × 400）的加载时间，大约8秒才能显示完整的页面。但实际的情况更加复杂，最基本的问题就是要加载的外部资源数据包的大小，这一因素直接影响了加载时间，要想保证每个外部资源的加载时间为400ms或者更短的时间，这又牵扯到CDN分布式存储。所以，在资金不足的情况下，我们能做的就是减少外部资源的连接数，还有就是精简和压缩静态数据。

为了解决这一问题，我为mPHP核心框架写了一个PHP函数file_merger，用来合并多个CSS样式文件或者JS脚本文件，并对生成的合成文件进行压缩，从而更进一步的减小外部资源的数据大小。

使用环境如下：

测试环境地址：http://localhost/

测试环境目录结构：

/static/css/，css样式目录存在1.css，2.css两个文件

/static/js/，js脚本目录下存在1.js，2.js

/static/merger/，合成文件保存目录

file_merger函数的使用例子如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<?php
include  'file_merger.php' ;
$CFG [ 'debug' ] = 0; //当值为1的时候，不进行合并压缩，按常规调用
$CFG [ 'java' ] = 0; //当值为1的时候，使用yuicompressor压缩；0使用PHP正则表达式简单压缩
$arrCss [] =  '1.css' ;
$arrCss [] =  '2.css' ;
$arrJs [] =  '1.js' ;
$arrJs [] =  '2.js' ;
$css  = file_merger( $arrCss , 'main.css' );
$js  = file_merger( $arrJs , 'main.js' );
echo  $css ;
echo  $js ;
/*
函数执行成功后，会在指定的合成文件保存目录生成main.css，main.js两个文件，并会输出结果如下
<link rel="stylesheet" type="text/css" href="http://localhost/static/merger/main.css?1389454147">
<script type="text/javascript" src="http://localhost/static/merger/main.js?1389454147"></script>
 
测试代码的时候可以把$CFG['debug']设置为1;
当为1的时候，不会生成合成文件，同时会得到如下输出结果，方便调试：
<link href="http://localhost/static/css/1.css?1389454824" rel="stylesheet" type="text/css">
<link href="http://localhost/static/css/2.css?1389454824" rel="stylesheet" type="text/css">
<script type="text/javascript" src="http://localhost/static/js/1.js?1389454824"></script>
<script type="text/javascript" src="http://localhost/static/js/2.js?1389454824"></script>
*/

file_merger有两种压缩方式，一种是使用雅虎基于java开发的yuicompressor，第二种就是我基于PHP正则表达式编写的压缩规则。优先推荐使用yuicompressor的压缩方式，但如果你的服务器环境不支持java，也可以使用第二种方法。

下边是file_merger函数的实现代码，如果使用过程中有什么问题，可以给我留言。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<?php
/*
作者:moyancheng
最后更新时间:2013-05-17
最后更新时间:2013-12-13
功能：将多个js或css，合并为一个js或css，并进行压缩
$arrPath:合并文件数组
$out:输出文件
$cache:是否缓存，默认为false,会在文件名后边加上时间戳，如main.js?1389424132
*/
function  file_merger( $arrFile , $out , $cache =false) {
     global  $CFG ;
     $url  =  'http://localhost/static/' ;//静态资源url地址，根据自己的情况修改
     $static  =  '/static/' ; //静态资源在服务器上的存储路径，根据自己的情况修改
     $dir  =  "{$static}merger/" ; //合成文件在服务器上的存储路径，根据自己的情况修改
     $return  =  "{$url}merger/{$out}" ;
     $out  =  "{$dir}{$out}" ; //
     $time  =  $_SERVER [ 'REQUEST_TIME' ];
     
     if (  substr ( $arrFile [0],-2) ==  'js'  ) {
          $type  =  'js' ;
     }  elseif (  substr ( $arrFile [0],-3) ==  'css'  ) {
         $type  =  'css' ;
     }
     
     //当文件不存在,或者调试模式,就执行下边的程序
     if ( ! is_file ( $out ) ||  $CFG [ 'debug' ]) {
         //调试模式,按常规加载js,css
         if (  $CFG [ 'debug' ] ) {
             $out  =  '' ;
             foreach ( $arrFile  as  $key  =>  $file ) {
                 if (  $type  ==  'js'  ) {
                     $out  .=  "<script type=\"text/javascript\" src=\"{$url}js/{$file}?{$time}\"></script>\n" ;
                 }  elseif (  $type  ==  'css'  ) {
                     $out  .=  "<link href=\"{$url}css/{$file}?{$time}\" rel=\"stylesheet\" type=\"text/css\">\n" ;
                 }
             }
             return  $out ;
         }  else  {
         //正式环境启动压缩
             ob_start();
             foreach ( $arrFile  as  $key  =>  $file ) {
                 include  $static . "{$type}/{$file}" ;
             }
             $str  =  ob_get_clean();
             $tmp  =  $dir .  'tmp' ;
             
             if ( $CFG [ 'java' ]) {
                 //java程序精简文件
                 file_put_contents ( $tmp , $str );
                 if (  $type  ==  'js'  ) {
                     $exec  =  "java -jar {$static}yuicompressor-2.4.2.jar --type js --charset utf-8 -v $tmp > $out" ; //压缩JS
                 }  elseif (  $type  ==  'css'  ) {
                      $exec  =  "java -jar {$static}yuicompressor-2.4.2.jar --type css --charset utf-8 -v $tmp > $out" ; //压缩CSS
                 }
                 ` $exec ` ;
             }  else  {
                 //php程序精简文件
                 $str  = preg_replace(  '#/\*.+?\*/#s' , '' ,  $str  ); //过滤注释 /* */
                 $str  = preg_replace(  '#(?<!http:)(?<!\\\\)(?<!\')(?<!")//(?<!\')(?<!").*\n#' , '' ,  $str  );//过滤注释 //
                 $str  = preg_replace(  '#[\n\r\t]+#' , ' ' ,  $str  ); //回车 tab替换成空格
                 $str  = preg_replace(  '#\s{2,}#' , ' ' ,  $str  ); //两个以上空格合并为一个
                 file_put_contents ( $out , $str );
             }
         }
     }
     unset( $CFG );
     if (  $cache  ) {
         if (  $type  ==  'js'  )  return  "<script type=\"text/javascript\" src=\"{$return}\"></script>\n" ;
         elseif (  $type  ==  'css'  )  return  "<link rel=\"stylesheet\" type=\"text/css\" href=\"{$return}\">\n" ;
     }  else  {
         if (  $type  ==  'js'  )  return  "<script type=\"text/javascript\" src=\"{$return}?{$time}\"></script>\n" ;
         elseif (  $type  ==  'css'  )  return  "<link rel=\"stylesheet\" type=\"text/css\" href=\"{$return}?{$time}\">\n" ;
     }
}

转载于:https://www.cnblogs.com/doubilaile/p/8432684.html

alexlee0123
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
css和js优化,js css优化-- 合并和压缩
weixin_42502448的博客
08-03 713
在项目框架中，首先要引用很多css和js文件，80%的用户响应时间都是浪费在前端。而这些时间主要又是因为下载图片、样式表、JavaScript脚本、flash等文件造成的。减少这些资源文件的Request请求数将是提高网页显示效率的重点。这里好像有个矛盾，就是如果我减少了很多的图片，样式，脚本或者flash，那么网页岂不是光秃秃的，那多难看呢？其实这是一个误解。我们只是说尽量的减少，并没有说完全不...
性能优化--JS、CSS压缩合并
驰骋翱翔
02-19 6407
在前台性能优化过程中，减少HTTP请求数量，就可以减少与服务器交互次数，从而很好的提高系统性能，此次通过实践，网络查阅资料，发现两种压缩合并js和css的方式：combres和BundleConfig；本文描述combres方式实现js、css压缩合并，望广大网友提出合理性意见和建议。
gulp压缩整合css和js文件
dadaDaShiXiong的博客
09-18 3977
具体可参考官网：http://www.ydcss.com/archives/18#lesson5 个人感觉简单，粗暴，好用 傻瓜式操作： 1.首先安装node.js（查看版本node-v） 2. 全局安装gulp :     npm install gulp -g    3. 新建文件夹，在当前文件夹下   npm init    （会自动通过npm下载package.json） 4....
前端性能优化
云中自有锦书
08-21 678
转载：前端性能优化的七大手段https://www.cnblogs.com/xiaohuochai/p/9178390.html 前言　　 本文将详细介绍前端性能优化的七大手段，包括减少请求数量、减小资源大小、优化网络连接、优化资源加载、减少重绘回流、使用性能更好的API和构建优化。 1.减少请求次数 【合并】 　　如果不进行文件合并，有如下3个隐患 　　1、文件与文件之间有插入的上行...
java css js 合并_合并压缩css和Js的方式( 转载）
weixin_36198673的博客
02-24 144
本篇博客从减少浏览器加载外部资源连接数的思考角度着手，要想深入了解其他加快网页显示速度的原理，估计又得花不少时间，这需要把前端跟后端都说解释清楚。有时间我会分开写其他部分的内容。这里为了节省时间，只介绍如何减少网页需要加载的外部资源，加快浏览器的响应速度。如果一个页面比较复杂，要展示的内容 比较多，就会包含很多外部资源、css样式还有js脚本，比如某个门户网站的的html代码如下：12345678...
r.js来合并压缩css文件的示例
10-18
**r.js 合并压缩 CSS 文件** r.js（RequireJS Optimizer）是一个强大的工具，用于优化 JavaScript 和 CSS 文件，主要用于减少网页加载时间和提高性能。它最初是作为 RequireJS 模块加载器的一部分开发的，但也可以...
使用grunt合并压缩js和css文件的方法
10-20
demo
WordPress 部署 Minify方法 自动压缩合并 JS 和 CSS
01-20
随着 WordPress 一版一版的升级，功能越来越多，代码量也越来越庞大，...压缩 JavaScript 和 CSS，是为减少文件大小，节省流量开销；合并 JavaScript 和 CSS，是为了减少请求数量，减轻服务器压力。而这些枯燥又没有技
mvc js和css文件压缩合并
02-13
在ASP.NET MVC4框架中，优化网页性能的一个关键步骤是对JavaScript (js) 和 Cascading Style Sheets (css) 文件进行压缩和合并。这有助于减少HTTP请求的数量，减小文件大小，从而提升网页的加载速度和用户体验。本文...
使用Gulp进行Javascript以及css压缩合并
weixin_34249367的博客
12-30 158
1.安装gulp gulp是基于Node.js的前端构建工具。所以首先需要安装nodejs，安装nodejs。 完成nodejs安装之后，需要使用npm安装gulp。 先安装全局gulp npm install -g gulp然后在项目根目录下安装本地gulp。 此时项目根目录下会多出下面这个文件夹 node_modules 好的，现...
JS和CSS压缩工具
10-03
在线压缩JS和CSS压缩工具，去空格与注释
compres实现js、css压缩合并
02-19
在前台性能优化过程中，减少HTTP请求数量，就可以减少与服务器交互次数，从而大大提高系统性能，欢迎大家一起来研究
css和js如何合并,多个js与css文件的合并方法详解
weixin_39802962的博客
08-04 1218
在web程序开发中，js、css文件会随着项目的开发变得越来越多，越来越大，会影响网站的性能。页面引入的的js与css文件过多的话，就会增加http的请求数，继而带来严重的性能损耗。一个好的方法就是合并js,css文件。以下的介绍以合并js文件为例。(1) G.js文件复制代码 代码如下:function(){window.G={};G.Method={add:function(){ alert(...
如何压缩自己的css和js,在开发中怎么压缩js和css?有哪些办法？
weixin_39706561的博客
08-03 386
在开发的时候我们会选择将自己的代码进行压缩和打包，那么对于“在开发中怎么压缩js和css?有哪些办法？”这个问题小编为带来了一些干货。对于压缩 js 与 css，我们一般是使用在线工具来实现的，我们这边就介绍我们的“站长工具”压缩方法。一、压缩 js我们在使用的使用将自己的代码复制粘贴在我们转码工具的左侧中，之后就可以在右侧看到解压之后的代码，点击普通压缩就可以实现了。截图如下二、css压缩我们根...
vue前端用服务器上路径的图片展示_谈谈前端性能自动化
weixin_39968640的博客
11-30 1822
前述：前段时间出了性能分析的需求，需要对前端页面性能做一套自动化测试工具。领导都发话了，那咱说干就干。花了一周时间去找资料以及匹配优秀并且合适的开源插件。花了一个月的时间(断断续续，需求也要做的~)完成了这个工具的建设和开发。目前也搭建了一套平台来支撑这样的工具使用。前端用的VUE，后端用的node(由于本人较熟悉前端)，数据库用的是mangoDB。好了，话不多说，上才艺~设计背景 & 前...
【前端安全】浅谈前端js和css的混淆压缩
赏樱看雪撸代码
08-17 999
JSCompress使用，js压缩混淆，css压缩混淆，前端安全
webpack之css/js/html文件的压缩
最新发布
strawberry sweet
08-31 2985
文件压缩分三种类型：js，css，html。
js css文件压缩
淡小生
04-25 662
当项目需要提交至外网环境时，可将js和css进行压缩，以提高页面的加载速度。 进行js css压缩有多种方式 ：    1 .node.js进行压缩 注：此方法未使用过    2 .nginx的gzip模块进行压缩 注：详细配置 在HTTP模块添加如下几段代码即可。 gzip on;    //开启gzip gzip_min_le
如何压缩css代码,在开发中怎么压缩js和css?有哪些办法？
weixin_31147757的博客
08-04 846
在开发的时候我们会选择将自己的代码进行压缩和打包，那么对于“在开发中怎么压缩js和css?有哪些办法？”这个问题小编为带来了一些干货。对于压缩 js 与 css，我们一般是使用在线工具来实现的，我们这边就介绍我们的“站长工具”压缩方法。一、压缩 js我们在使用的使用将自己的代码复制粘贴在我们转码工具的左侧中，之后就可以在右侧看到解压之后的代码，点击普通压缩就可以实现了。截图如下二、css压缩我们根...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值