Skip to content

Instantly share code, notes, and snippets.

View dkypooh's full-sized avatar

matrixlabs dkypooh

  • Hangzhou, China
View GitHub Profile
@dkypooh
dkypooh / meld.js
Created March 16, 2017 03:24
meld aop
/** @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
@dkypooh
dkypooh / .js
Created March 16, 2017 03:24
meld aop
/** @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
@dkypooh
dkypooh / performance.md
Last active March 15, 2017 02:18
WEB页面性能优化

WEB页面性能优化

随着前端蓬勃发展,业务复杂性的增加,如何优化WEB页面性能,逐渐变成我们需要去解决的巨大挑战。

WEB性能优化又是一个比较宽泛的领域, 本文只以一次产品迭代需求添加大量的拖拽行为,当会话量巨大的时候, 导致严重页面卡顿为例,从三个递进的维度去思考如何去优化WEB的页面性能。

  1. 如何定位性能问题, 内存泄漏问题
  2. 如何在业务复杂的情况下,保证用户体验
  3. 如何处理解决性能问题

Alt pic

@dkypooh
dkypooh / exchange.md
Last active March 14, 2017 08:09
简历
@dkypooh
dkypooh / productFront.md
Last active March 2, 2017 03:45
产品化前端开发一些实践及经验

前言

产品化的前端开发,根据具体的业务特点,将前端的开发流程、技术、工具、经验等规范化、标准化。最大程度地提高前端工程师的开发效率,降低技术选型、前后端联调等带来的协调沟通成本。

本分享主要是我们在产品化前端开发上的探索实践

工业化前端开发

提纲

@dkypooh
dkypooh / tradeKefu.md
Created March 2, 2017 03:24
平台化电商客服系统的一些实践及经验

前言

随着各大电商平台的崛起,当电商达到一定规模时,会发展成为平台型电商,引入第三方商家在平台中销售。由第三方商家直接进行服务,同时平台方需要对第三方商家的坐席和服务情况进行管理。

需求分析

原来企业访客端IM实体是一个人对应一个聊天窗口的概念。见《构建客服系统一些实践及经验Alt pic

平台型电商的访客端IM实体变成一个人对应多个商户的概念。 Alt pic

@dkypooh
dkypooh / kefu.md
Last active April 16, 2018 02:52
构建客服系统一些实践及经验

如何构建客服系统

对于一个客服系统,甚至包括WEB端微信, 我们都可以简单的抽象为一个IM系统; 只是随着产品业务的不同, 需要支持不同的数据格式, 定义通信的协议及规范。

对于IM的前端整个过程可以分为:通讯方式, 协议, 数据格式, UI表现层

通讯方式

要保持数据的实时通信,WEB端基本就是两种方式: 轮询和长连接。 Web端可以用WebSocket来解决,这也是业界普遍采用的方案。 通讯环节是相当耗费服务器资源的一个环节,而且开发成本偏高,建议将这些第三方的平台直接集成到自己的项目中,以降低开发的成本。 比如云信就是真正稳定的IM云服务平台

协议的定义

@dkypooh
dkypooh / webpack.config.css.js
Created December 30, 2016 02:29
Postcss Webpack Config
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 : {
@dkypooh
dkypooh / style.js
Last active December 6, 2016 07:31
How to add Style On Dom
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();

Virtual DOM and diffing algorithm

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.