WEB学习笔记3-开发环境和工具

WEB前端集成开发环境：Aptana Studio和WebStorm
WEB前端代码调试：IE浏览器自带的IE Dev Toolbar，Chrome浏览器自带的Developer Tools，Firefox浏览器插件Firebug，Safari浏览器自带的Develop系列工具
WEB前端性能分析：常用的Web前端性能分析工具有YSlow、PageSpeed及各浏览器自带开发工具，
 

Chrome开发工具：
　　Network:查看各个资源请求和下载所用的时间
 　  Timeline：查看网页渲染和交互过程中各个步骤所花费的时间，从资源的加载到javascript的解析执行、样式的应用和绘制
　　Profiles：查看网页的CPU以及内存占用情况报告
　　Audits：提供了各种资源和配置优化的建议和未使用CSS规则的列表

代码和资源压缩

　　1：web服务器开启Gzip压缩，在HTTP中允许客户端从服务器上下载压缩的内容，服务器配置人员可以查看服务器对应的配置文件，开启Gzip压缩。

　　2：javascript代码压缩，原理一般是，去掉多余的空格和回车，替换长变量名，简化一些代码写法等。压缩工具：Uglify,YUI Compressor,Closure Compiler

　　3:  CSS代码压缩，和javascript原理类似。压缩工具：CSS Compressor

　　4: Html代码压缩，压缩工具：HTMLCompressor

　　5: 图片资源压缩，压缩工具：TinyPNG工具压缩PNG图片，JPEGmini压缩JPG图片，本地应用程序，推荐ImageOptim

推荐在网站开发后期，甚至在网站哦发布阶段做代码和资源的压缩，发布阶段压缩代码，推荐使用ANT工具；前端自动化构建工具Grunt,也可以集成代码和资源的压缩工具。

转载于:https://www.cnblogs.com/catherine9192/p/9272464.html