随着前端蓬勃发展,业务复杂性的增加,如何优化WEB页面性能,逐渐变成我们需要去解决的巨大挑战。
WEB性能优化又是一个比较宽泛的领域, 本文只以一次产品迭代需求添加大量的拖拽行为,当会话量巨大的时候, 导致严重页面卡顿为例,从三个递进的维度去思考如何去优化WEB的页面性能。
- 如何定位性能问题, 内存泄漏问题
- 如何在业务复杂的情况下,保证用户体验
- 如何处理解决性能问题
| /** @license MIT License (c) copyright 2011-2013 original author or authors */ | |
| /** | |
| * meld | |
| * Aspect Oriented Programming for Javascript | |
| * | |
| * meld is part of the cujo.js family of libraries (http://cujojs.com/) | |
| * | |
| * Licensed under the MIT License at: | |
| * http://www.opensource.org/licenses/mit-license.php |
| /** @license MIT License (c) copyright 2011-2013 original author or authors */ | |
| /** | |
| * meld | |
| * Aspect Oriented Programming for Javascript | |
| * | |
| * meld is part of the cujo.js family of libraries (http://cujojs.com/) | |
| * | |
| * Licensed under the MIT License at: | |
| * http://www.opensource.org/licenses/mit-license.php |
随着各大电商平台的崛起,当电商达到一定规模时,会发展成为平台型电商,引入第三方商家在平台中销售。由第三方商家直接进行服务,同时平台方需要对第三方商家的坐席和服务情况进行管理。
原来企业访客端IM实体是一个人对应一个聊天窗口的概念。见《构建客服系统一些实践及经验》
| var webpackConfig = require('./webpack.config'); | |
| var ExtractTextPlugin = require("extract-text-webpack-plugin"); | |
| module.exports = { | |
| entry : './src/style.js', | |
| output : { | |
| filename : 'style.js', | |
| path : './docs' | |
| }, | |
| module : { |
| module.exports = function(list, options) { | |
| if(false) { | |
| if(typeof document !== "object") throw new Error("The style-loader cannot be used in a non-browser environment"); | |
| } | |
| options = options || {}; | |
| // Force single-tag solution on IE6-9, which has a hard limit on the # of <style> | |
| // tags it will allow on a page | |
| if (typeof options.singleton === "undefined") options.singleton = isOldIE(); |
There was a [great article][1] about how react implements it's virtual DOM. There are some really interesting ideas in there but they are deeply buried in the implementation of the React framework.
However, it's possible to implement just the virtual DOM and diff algorithm on it's own as a set of independent modules.