之前做了一个大转盘的抽奖活动,因为比较火,部分用户反馈看不到页面的情况,我怀疑js加载请求过慢导致,所以今天针对之前的一个页面进行调试优化。

首先想到的是对页面的js和css进行压缩优化,百度了下vs集成的插件,貌似没有很好的支持,自己在vs里找了一个非常满意的插件——Bundler & Minifier

这个vs插件下载地址:点我

插件功能说明:

1.合并多个css,js,html文件为一个单独的文件

2.保存源文件自动重新组合。

3.压缩css,js,html文件

等等。。。(其他我没用到,就不写了,可以看插件的英文说明)

使用方法:

比如我本地有两个js文件,我选择这两个js文件,右键,会看到该菜单——Bundle and Minify Files(合并并且压缩文件)

然后选择保存的新文件的名字(我本地文件叫:newtask.js),即可自动把两个js合并成一个js并生成压缩文件。

通过该插件的压缩,我把页面的js全部替换成压缩后的min.js以后,页面加载的时间从原来的6s,减少到2秒。效果还是比较明显的。

如有不对的地方请多多提意见,谢谢!^_^

vs合并压缩css,js插件——Bundler & Minifier的更多相关文章

  1. grunt自定义任务——合并压缩css和js

    npm文档:www.npmjs.com grunt基础教程:http://www.gruntjs.net/docs/getting-started/ http://www.w3cplus.com/to ...

  2. 前端自动化(三) 合并压缩css、压缩js、添加时间戳、打包上线操作

    前端自动化(三)   合并压缩css.压缩js.添加时间戳.打包上线操作 此文在前两篇基础上对比参考,会很方便理解 gulp.task("delete",function(){ r ...

  3. uglifyjs 合并压缩 js, clean-css 合并压缩css

    本文主要介绍如何通过CLI命令行(也就是终端或者cmd打开的那个shell窗口)实现 js和 css 的合并压缩. uglifyjs 合并压缩 js: 1.安装node 这一步就不多说了,下载node ...

  4. asp.net mvc项目实记-开启伪静态-Bundle压缩css,js

    百度这些东西,还是会浪费了一些不必要的时间,记录记录以备后续 一.开启伪静态 如果不在web.config中配置管道开关则伪静态无效 首先在RouteConfig.cs中中注册路由 routes.Ma ...

  5. ASP.NET MVC Bundles 合并压缩(js css)

    Chrome浏览器有并发的Http请求限制,Bundles可以将多个JS文件合并成一个文件并进行压缩,最终得到一个单文件的压缩包. 第一步:BundleConfig public class Bund ...

  6. 使用grunt完成requirejs的合并压缩和js文件的版本控制

    最近有一个项目使用了 requirejs 来解决前端的模块化,但是随着页面和模块的越来越多,我发现我快要hold不住这些可爱的js文件了,具体表现在每个页面都要设置一堆 requirejs 的配置( ...

  7. JAVA使用YUI压缩CSS/JS

    前言 JS/CSS文件压缩我们经常会用到,可以在网上找在线压缩或者本地直接使用,我这里使用的是yahoo开源组件YUI Compressor.首先介绍一下YUI Compressor,它是一个用来压缩 ...

  8. 用 Flask 来写个轻博客 (28) — 使用 Flask-Assets 压缩 CSS/JS 提升网页加载速度

    Blog 项目源码:https://github.com/JmilkFan/JmilkFan-s-Blog 目录 目录 前文列表 扩展阅读 Flask-Assets 将 Flask-Assets 应用 ...

  9. Sublime Text2格式化HMTL/CSS/JS插件HTML-CSS-JS Prettify

    之前格式化用过JSFormat,今天在GitHub发现了一个比较好的插件HTML-CSS-JS Prettify,具体的地址https://github.com/victorporof/Sublime ...

随机推荐

  1. LINQ to SQL语句(2)之Select/Distinct

    适用场景:o(∩_∩)o- 查询呗. 说明:和SQL命令中的select作用相似但位置不同,查询表达式中的select及所接子句是放在表达式最后并把子句中的变量也就是结果返回回来:延迟.Select/ ...

  2. C#单纯的字母数字ASCII码转换

    字母转换成数字 byte[] array = new byte[1];   //定义一组数组array            array = System.Text.Encoding.ASCII.Ge ...

  3. Nancy 引用源码与NuGet安装差异

    使用NuGet安装Nancy和直接引用源码项目存在一些差异,如序列化,授权验证问题. 如果引用源码的话,自定义JsonSerializer,如下: 注意,需要使用NuGet安装Newtonsoft.J ...

  4. 点击页面任何位置隐藏div

    <include file="Public:header" /> <style type="text/css"> table{width ...

  5. 2016暑假多校联合---To My Girlfriend

    2016暑假多校联合---To My Girlfriend Problem Description Dear Guo I never forget the moment I met with you. ...

  6. Data Structures/Algorithms 小甲鱼99讲笔记系列(1~~15讲)

    参考资料地址: http://www.icoolxue.com/ 1.数据结构中四种逻辑结构. ① 集合 集合中任何两个数据元素之间都没有逻辑关系,组织形式松散. ② 线性结构 线性结构中的 结点按逻 ...

  7. 利用PBFunc在Powerbuilder中支付宝当面付功能

    在PB实现支付宝当面付的功能,需要先在支付宝进行商户签约,并设置相关的公钥信息(具体参考支付宝文档). 然后使用对应的私钥文件对参数进RSAWithSha1前面计算.具体代码如下: string ls ...

  8. Verilog学习笔记认识提升篇(一)...............时序的基本概念(待补充)

    建立和保持时间: 建立时间(Tsu)是指在时钟上升沿到来之前数据必须保持稳定的时间,保持时间(Th)是指在时钟上升沿到来以后数据必须保持稳定的时间.一个数据需要在时钟的上升沿被锁存,那么这个数据就必须 ...

  9. 超强教程:如何搭建一个 iOS 系统的视频直播 App?

    现今,直播市场热火朝天,不少人喜欢在手机端安装各类直播 App,便于随时随地观看直播或者自己当主播.作为开发者来说,搭建一个稳定性强.延迟率低.可用性强的直播平台,需要考虑到部署视频源.搭建聊天室.优 ...

  10. ejs-mate

    安装 npm install ejs-mate --save 模板方法: 1.layout 2.partial 3.block