在Web项目的开发中,js,css文件会随着项目的开发变得越来越多,越来越大,这就给给性能方面带来一些问题,如,页面引入的的js,css越多的话,那么对就增加了http请求数,解决该问题的一个好的方法
在项目开发环境下，我们会把 JS 代码尽可能模块化，方便管理和修改，这就避免不了会出现一个项目自身 JS 文件数量达到 10 个或者更多。 而项目上线后，会要求将所有 JS 文件合并为 1 个或者几个，手动的操作虽然也不是问题，但每次修改更新都要手动操作合并一遍，这就肯定是个噩梦了。 这种情况下，一些工具也就随之产生，比如在线合并，一些网站提供js文件上传，然后合并，但这还是很麻烦，如果开发环境没有网络呢？ 这会我就想到了 windows 系统下的 cmd 里的 copy 命令，它虽然是个复
1.线上环境静态文件存放于前端CDN静态池,有一个专门的发布系统可以上传文件.在发布文件的时候需要创建url路径,因为CDN的缓存原因,在路径中增加了版本号,最终结果的url类似这种//n.sinaimg.cn/mail/sinamail66/js/139276/xxx.js
这是我们部门前端同学cobish的学习笔记，笔者编辑了一下并分享给大家。 在使用 Grunt 之前，项目静态文件几乎没进行压缩合并便直接放到线上，部分文件手动复制粘贴到某压缩网站进行压缩。没压缩合并的
性能在Web应用程序中起着至关重要的作用，甚至谷歌也很在意其查询性能。不要因为一个几KB的文件只需要1毫秒的下载时间就不去重视，因为涉及性能时每个毫秒都需要去关注。最好能优化、压缩和缓存一切。
我们在做wordpress速度优化时总可以发现很多插件都提供了css/js合并功能。那么我们真的需要启用这个功能吗？
产品经理：我们本次开发三个功能，列表页功能、详情页功能、系统消息功能，分两次上线，先上列表功能，再上详情页和系统消息。
本文作者：lzaneli，腾讯 TEG 前端开发工程师 “合并前文件还在的，合并后就不见了”、“我遇到 Git 合并的 bug 了” 是两句经常听到的话，但真的是 Git 的 bug 么？或许只是你的预期不对。本文通过讲解三向合并和 Git 的合并策略，step by step 介绍 Git 是怎么做一个合并的，让大家对 Git 的合并结果有一个准确的预期，并且避免发生合并事故。 故事时间 在开始正文之前，先来听一下这个故事。 如下图，小明从节点 A 拉了一条 dev 分支出来，在节点 B 中新增了一
每个插件和主题可能有自己的 CSS 和 JavaScript 内联代码或者文件，如果 CSS 和 JavaScript 内联代码或者文件一多，就开始出现了两个比较难受的问题：
我们在开发的时候会习惯缩进和写注释，方便我们在日常的维护，但将代码上传至服务端后，我们完全可以把那些空格、制表符、换行符进行压缩，以此减少请求资源的大小；同样的，我们在服务端所引用的第三方库进行合并，能减少 HTTP 的请求数量
网站性能优化是一个永恒的话题，前面我已经介绍了 WordPress 后端性能优化的一系列方法，下面讲解下 Web 前端的性能优化，其中最重要是减少 HTTP 请求和压缩文件的大小，今天来介绍下使用 Minify 来合并和压缩 CSS 和 JavaScript 文件，
前因：在第一个使用angularjs的项目中我将所有的controller写到一个文件里面，深知维护起来那滋味，所以再次使用angularjs的时候，我便把所有的controlle、directive、factory给提取到相应的文件夹下面，以便于维护。此时js这么多表示很无奈。
一，作用： (1) 能够完成代码的压缩 (2) 合并，复制，监听，ES6的代码转换，启动服务器等等
《生活大爆炸》中 让大家折腾不已的时光机问题 小编想说 谢耳朵这么折腾也就算了 没想到前端优化也是如此折腾不止 写在前面 作为开发，不仅仅是前端，优化总是你绕不开的事，我们的目标就是要产品变更得更快。优化的对象不仅仅指产品本身，还有我们日常的开发流程。要打造一个无痛的开发流程，并且能够相对轻松的对产品持续优化真的不轻松。没有银弹，任何项目都要花很多时间和精力。但任何值得改善的地方能够有所提升都让我们觉得努力没白费。有时候只想懒一点，从枯燥的重复中解放出来。 从作者加入团队到现在，过程中遇到了很多问题
grunt是什么 grunt是目前非常流行的前端构建工具，支持自定义插件，有丰富的插件帮助我们完成构建任务 自动化完成我们指定的任务，例如压缩、编译、单元测试、linting等 前端为什么需要构建工具 先看下前端的开发场景 小项目中，css文件和js文件并不多，前端部分是很轻的，几乎不需要我们特别的关注 而在一个大项目中，css文件和js文件的数量会达到几十个上百个，一个页面中会引用很多css和js文件，js的开发方式也已经模块化，不再像之前那样 经常把很多函数写在一个文件中，css的开发开始使用SAS
作者：addy（许斌），前端开发工程师，文艺青年一枚，写得了文章，编得了代码。 作为开发，不仅仅是前端，优化总是你绕不开的事，我们的目标就是要产品变得更快。优化的对象不仅仅指产品本身，还有我们日常的开发流程。从加入团队到现在，大概有一半左右的时间花在了优化上，期间遇到了很多问题，回过头看，优化这件事情并不是那么简单，也是些很琐碎的事情，要打造一个无痛的开发流程，并且能够相对轻松的对产品持续优化真的不轻松。没有银弹，任何项目都要花很多时间和精力。但任何值得改善的地方能够有所提升都让我们觉得努力没白费。有时候只
微信小游戏推出后，LayaAir引擎也同步支持了微信小游戏的开发，由于很多开发者对微信小游戏的开发流程不够了解，不太清楚如何下手。为此，我们在2018年的开工首日，从简介篇，小游戏创建篇，综合介绍篇三部分，全面介绍微信小游戏的开发、测试，与重要项目规则。
小S维护的一个前端系统，单个页面中有数个没有依赖关系的 js 、css 需要加载，此时浏览器会分别去请求对应的文件。此时小S收到Leader给的一个任务：优化前端的静态资源请求，尽量做合并。
一、HTML 压缩 1、利用在线网站进行压缩（https://tool.oschina.net/） 2、nodejs 提供了 html-minifier 工具 3、后端模板引擎渲染压缩 二、CSS 压缩 1、利用在线网站进行压缩 2、使用 html-minifier 对 html 中的 css 进行压缩 3、使用 clean-css 对 css 进行压缩 三、JS 压缩与混乱 1、无效字符的删除 2、剔除注释 3、代码语义的缩减和优化 4、代码保护 四、文件合并 （将 a.js、b.js、c.js 合并成一
如今，越来越多的JavaScript代码被使用在页面上，我们添加很多的内容在浏览器里。如何去很好的组织这些代码，成为了一个必须要解决的难题。
关于对开发环境和生产环境做不同的webpack配置。 git仓库：webpack-demo 1、缘起 这章我们要做下环境打包的一个区分啊，通过上面很多章的了解学习以后，我们知道，webpack.config.js仅仅这一个配置文件已经不能满足我们的需求了，因为开发环境和生产环境配置的内容是不一样的，有这么些异同： mode模式，生产环境需配置为developmet，开发则设置为production; devtool的souremap； devServer，开发环境需要配置跨域代理转发，而生产
在现在的前端开发中，前后端分离、模块化开发、版本控制、文件合并与压缩、mock数据等等一些原本后端的思想开始逐渐渗透到“大前端”的开发中。前端开发过程越来越繁琐，当今越来越多的网站已经从网页模式进化到了 Webapp 模式。它们运行在现代的高级浏览器里，使用 HTML5、 CSS3、 ES6 等更新的技术来开发丰富的功能，网页已经不仅仅是完成浏览的基本需求，并且Webapp通常是一个单页面应用(SPA)，每一个视图通过异步的方式加载，这导致页面初始化和使用过程中会加载越来越多的 JavaScript 代码，这给前端开发的流程和资源组织带来了巨大的挑战。
想要成为一名合格的Web前端工程师，Web前端性能优化是一个必须要掌握的知识，那么应该怎么进行Web前端性能优化呢？--达达前端
我们开发项目的使用，有很多的文件，比如js，css ，图片等其他的文件，直接将这些文件放到服务器上面，浏览器是不能解析的。所以，我们需要一些工具，对这些文件进行打包与转化，之后将转化之后的东西放到服务器上面，浏览器就可以解析了。
确定图片的坐标比较繁琐且易出错，同时使用图片地图导航也不具有可读性，因此不推荐使用图片地图。
chrome v28.0.1500.71 + nodejs v0.10.18 / firefox v14.0.1 + nodejs v0.10.18
当项目中包含多条功能分支时，有时就需要使用 git merge 命令，指定将某个分支的提交合并到当前分支。Git 中有两个合并策略：fast-forward 和 no-fast-forward。
puppeteer: Google 官方出品的 headless Chrome node 库 puppeteer github仓库 puppeteer API
在web产品优化准则中，很重要的一条是针对js脚本的加载和执行方式的优化。本篇文章简单描述一下其中的优化准则。 1. 脚本加载优化 1.1 脚本位置对性能的影响 优化页面加载性能的原则之一是将script标签放在body底部，这跟浏览器的渲染原理有关： js脚本的下载和执行会阻塞浏览器的解析。在较早时期，浏览器不支持并行下载的时候，js脚本的下载执行按照在html文档中的位置依次进行，可以想象当页面有大量js脚本时页面的加载有多慢； js脚本的下载会阻塞其他资源的下载，比如图片、外链css等。虽然目前大多数
- 对于浏览器而言，html文件是用户访问的入口点，也是所有资源的挂载点，所有资源都是通过html中的标记来进行引用的。
grunt与seajs grunt是前端流行的自定义任务的脚手架工具，我们可以使用grunt来为我们做一些重复度很高的事情，如压缩，合并，js语法检查等。通过定义grunt的配置文件Gruntfile.js，配置并注册grunt的任务，最终我们可以通过命令行来执行任务。 seajs主要用于模块化，通过define定义一个模块，可以通过require加载模块，exports导出模块。具体的seajs实现可通过本博客的系列博文--Seajs源码解析系列来进一步了解。
在线转换如下 babeljs es6console（这个貌似才行） 这里讲解本地转换和本地实时准换，供学习ES6和ES5的语法对比使用
微注： 前端更新实在是迅捷！谈及前端打包工具，Gulp 取代 Grunt荣登王者，其宝座还未热乎，16年 Webpack 便劈天盖地席卷而来。即便笔者在记叙这篇文章时候，也早已是投身于 Webpack 的石榴裙下, 且少使用Gulp了；所以，于此你应该有所考量。当然，Gulp很强大，辅助完成些脚本，也是很好的存在，譬如生成雪碧图、Sftp服务器上传等；且在2016年中也更新到4.0——一个很吸引人的版本。(Update@17/01/16) Gulp-sftp的喜忧路 一路从Xftp，winScp，Subli
我们在建网站时经常会用js特效代码以使页面更美观，比如js幻灯片代码、js下拉菜单等，但是网页特效一多，如果js文件没有合并的话会降低网站的性能，这时我们就要考虑合并js文件了，ytkah总结了以下几种方法可以实现： 1.把不输出（没有document.write）的公共函数合到一起，如果单纯地把两个js文件内容copy到一起可能会出错 2.新建一个import.js文件，把所有的js文件全部写进去 with(document){ write('<script type="text/javasc
这是第 101 篇不掺水的原创，想要了解更多，请戳上方蓝色字体：政采云前端团队 关注我们吧～ 本文首发于政采云前端团队博客：手把手带你入门Webpack Plugin https://www.z
今天，我们发布了一个引擎大版本LayaAir 2.1.0 beta，从此我们进入了纯webGL模式的2.1.x时代。浏览器自带的canvas API从这个版本开始不再支持，因此也会带来一些调整，本篇会进行说明。
今天考虑一个mcu混合的实现，也就是接收多路过来的rtp流，然后转发出去一路的rtmp流，使用ffmpeg测试做的记录，刚开始一直通过ffmpeg推送的文件流不能满足要求，还是对参数配置不熟悉；
要想弄明白git add和git commit的区别，首先我们需要知道三个概念：工作区(Working Directory)、版本库(Repository)、暂存区(Stage or index)。
于是我将近段时间的、关于TS的学习笔记梳理成30张脑图做了这次分享，也方便以后查阅
gulp是前端开发过程中对代码进行构建的工具，是自动化项目的构建利器；她不仅能对网站资源进行优化，而且在开发过程中很多重复的任务能够使用正确的工具自动完成；使用她，我们不仅可以很愉快的编写代码，而且大大提高我们的工作效率。
网站前端的用户体验，决定了用户是否想要继续使用网站以及网站的其他功能，网站的用户体验佳，可留住更多的用户。除此之外，前端优化得好，还可以为企业节约成本。那么我们应该如何对我们前端的页面进行性能优化呢？
友情提示：推荐阅读时间15分钟 + 练习时间15分钟 HTML5学堂：上一期给大家分享了Gulp的安装与使用，让大家对Gulp有着初步的认识。咱们学习使用Gulp的目的是提升开发效率，把开发过程中重复性的工作交给Gulp，让Gulp按照你的配置去完成操作。 Gulp本身给开发者提供了5个API接口，可以根据这些接口来开发Gulp插件。但是，Gulp目前拥有丰富的插件资源，开发人员可以根据项目的需求和个人偏好来配置使用这些插件，比如可以配置当修改了HTML文件浏览器自动刷新，也可以配置修改了CSS文件浏览器自
不管是小项目还是大项目，将配置与代码分离是一个非常好的做法。我们通常将配置写到一个配置文件里，如 config.js 或 config.json，并放到项目的根目录下。但通常我们都会有许多环境，如本地开发环境、测试环境和线上环境等，不同的环境的配置不同，我们不可能每次部署时都要去修改引用config.test.js 或者 config.production.js。config-lite 模块正是你需要的。
大家都知道wordpress过于庞大,到了一定的访问量之后就有亿点点的卡顿，加载时间特别感人。但是，WP Fastest Cache这时候就有点用，设置也比较简单，并且拥有汉化，可以切换多种语言。插件有付费版，但是我觉得没有什么必要，免费版功能很全，已经满足缓存需求了。
Yeoman 生成的 Angular 脚手架提供了 27 个任务配置和 3 个自定义任务。这三个自定义任务分贝为:
http://yujiangshui.com/grunt-basic-tutorial/
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
实时音视频
