JS和CSS压缩部署,提高访问效率
一直想把项目中的js和css压缩下,今天终于搞定了。
先说说几个注意的问题,目标影响着你对应的解决办法:
1.压缩后的文件,是否要直接覆盖旧的文件
2. 单个压缩文件重命名,还是整个目录换个名字,同时文件名称不变
3. 部署访问和切换问题
4.压缩后的,是否要上传到git等远程仓库里
比如
C:/js
a.js,a.css
方式一,直接覆盖,目录和文件名称,都不变化。
方式二,不覆盖,仍然在同一个目录下。
C:/js/a.min.js
方式三,换个目录,同名
C:/js2/a.js
------------------------------
开发过程中,可能习惯用 未压缩的,上线后希望用压缩的。
写这篇文章,真的很让人纠结,因为感觉场景太多了,想着好累。
------------------------------
压缩工具和方式有很多中:
方式一:使用yuicompress。可以用命令行的方式,比如java、nodejs等。
方式二:使用tbcompress,据说是淘宝根据yuicompress改造的。
方式三:直接用源码,在java程序中控制压缩的。
------------------------------
最后说说自己目前的方式:
1.本地Java项目中,有个压缩工具类。
把a目录下的所有css和js文件,压缩后,放到b目录下
2.a和b都被提交到git上
3.静态资源url是可变的。
frontStaticUrl=http://a.com:80/a
可以改成
frontStaticUrl=http://a.com:80/b
就实现了 原始文件和压缩版的切换
------------------------------
以上方式,不好的地方。
1.原始文件变化了,压缩文件也要再生成一次。
当然为了简单,只有在确定需要部署上线的时候,再执行压缩,提交到git上。
2.由于是程序的方式,对执行环境有了更高的要求。
比如,另外一个项目或者非java项目,也想进行压缩,就搞不定了。
------------------------------
JS和CSS压缩部署,提高访问效率的更多相关文章
- MVC中的JS和CSS压缩
小说一下Js和CSS压缩的好处: 1.减小了文件的体积 2.减小了网络传输量和带宽占用 3.减小了服务器的处理的压力 4.提高了页面的渲染显示的速度 很多建议将站点的静态文件(如图片.js.css ...
- 【MVC】 js,css 压缩
[MVC] js,css 压缩 一. 引用 System.Web.Optimization.dll : 使用 Nuget ,在控制台输入 Install-Package Microsoft.AspNe ...
- 一、FreeMarker实现对js和css压缩
1.代码压缩理解:实际上就是将原有的文本中无用的注释.空行.空格去掉来压缩文件的大小.进行js和css压缩会带来如下好处:1)减小了文件的体积,减少文件占用的内存;2)减小了网络传输量和带宽占用; 3 ...
- 简短的几句js实现css压缩和反压缩功能
写在前面 最近一直在整理css,但因为现在Visual Studio 2013太智能了,它每每在我按ctrl+E+D进行格式化代码的时候,就会将css进行层次格式化(如下图所示),而这个格式让我老大实 ...
- Thinkphp js、css压缩类minify
说明:Minify 是用PHP5开发的应用,通过遵循一些Yahoo的优化规则来提高网站的性能.它会合并多个CSS或者JavaScript文件,移除一些不必要的空格和注释,进行gzip压缩,并且会设置浏 ...
- springboot项目中js、css静态文件路径访问
springboot静态文件访问的问题,相信大家也有遇到这个问题,如下图项目结构. 项目结构如上所示,静态页面引入js.css如下所示. 大家肯定都是这样写的,但是运行的话就是出不来效果,图片也不显示 ...
- Hosts文件实际应用 配置内部服务器提高访问效率和速度
一 hosts文件的作用和介绍 https://jingyan.baidu.com/article/335530da45485e19cb41c3d6.html https://www.cnblogs. ...
- nginx优化:配置gzip压缩页面提高访问速度(nginx1.18.0)
一,为什么nginx要使用gzip 1,压缩的作用: 页面使用gzip压缩之后, 页面大小可以压缩到原来的1/7左右, 传输速度和页面打开时间都可以大幅度提高, 有利于用户访问页面体验的提升 2,Ng ...
- 18 个最好的CSS框架用于提高开发效率
根据维基百科,CSS框架是事先准备好的库,是为了让使用层叠样式表语言来美化网页更容易,更符合标准.在这篇文章中,我们已经收集了一些现成的框架,这将使你减少你的任务流程和代码.我们希望你会发现列表中的方 ...
随机推荐
- react radio onchange事件点击无效
记: 项目需求: 页面中radio默认选中 第一次进去页面 点击radio的时候不管怎样点击 都是选中 连onChange事件都没触发 进入页面 点击刷新 点击rad ...
- JS正则 replace()方法全局替换变量(可以对变量进行全文替换)
转至:https://www.cnblogs.com/jasonlam/p/7070604.html var text = "饿~,23333.饿~,测试yongde"; var ...
- python 时间合集 一
**以下内容均为我个人的理解,如果发现错误或者疑问可以联系我共同探讨**#### python中4种时间表示形式:1.格式化时间字符串 2.时间戳 3.时间元祖 4.时间对象- string_time ...
- 100.dll调用
在dll中声明 _declspec(dllexport) ; _declspec(dllexport)void go() { MessageBoxA(, ); } 调用dll HINSTANCE hl ...
- FreeMarker template error: The following has evaluated to null or missing
使用freemarker前端分页,报错: FreeMarker template error: The following has evaluated to null or missing 后端直接赋 ...
- 【hihocoder 1564】同步H公司的终端
[链接]http://hihocoder.com/problemset/problem/1564 [题意] 在这里写题意 [题解] 如下图 (上图中节点旁边的红色数字为它的权值) 从叶子节点开始考虑. ...
- 洛谷 P2807 三角形计数
P2807 三角形计数 题目背景 三角形计数(triangle) 递推 题目描述 把大三角形的每条边n等分,将对应的等分点连接起来(连接线分别平行于三条边),这样一共会有多少三角形呢?编程来解决这个问 ...
- Instant Client 配置
Instant Client Download 选择 Instant Client for Microsoft Windows (32-bit) 由于PL/SQL Developer 不支持64b ...
- Machine-learning of Andrew Ng
Machine-learning of Andrew Ng 1.基础概念 机器学习是一门研究在非特定编程条件下让计算机采取行动的学科.最近二十年,机器学习为我们带来了自动驾驶汽车.实用的语音识别.高效 ...
- iTestin云测工具
软件概述 iTestin是免费服务移动App开发者的真机自动化云测试客户端工具.基于真实的智能终端设备录制一个测试脚本然后运行,并输出运行结果.覆盖Android和iOS两大设备平台,支持Pad/Ph ...