• 日均流量超百万+以上项目实用
• config配置建议说明
• mongodb，redis集群搭建
• nginx配置servers的负载均衡
• 其他配置及其说明

• 如何监听用户错误信息上报
• 如何判断是页面加载时的error|ajax还是用户后续操作时的error|ajax
• 在何处上报，什么事件时处理上报比较合适
• 怎样支持单页面应用程序

• kafka在node.js中的使用kafka-node库
• 项目中的kafka限流策略方式
• egg.js中对kafka的封装并抽离成egg-kafka库
  
• zanePerfor中对开启kafka消息队列和相关配置说明
• 生产者，消费者的多种Api使用方式说明

• Mac 系统中kafka的安装
• Linux 系统中kafka的安装
• 常用的窗口命令

• cookie存储session令牌标识
• 每次登录动态更新cookie令牌标识
  
• redis存储用户信息并设置令牌过期时间
• 同一时刻相同账号只能在一个地方登录

• 可链式调用API生成mysql语句
• 也可链式生成sql语句之后直接执行
• 2种执行方式，使用灵活

所有设备屏幕自适应（iphone/android）

1px在Flutter中的解决方案

初学咋到，各种组件不熟悉，做个记录

记录常规组件的常用熟悉和方法，方便查阅

• 解决了单表的存储压力
• 解决了单表的读写压力
• 减少索引字段和索引体积大小
• 应用解耦与查询性能的提升

为什么要分片：

• 解决高并发时系统吞吐量

• 解决垂直扩展的价格昂贵成本，降低成本

• 提高系统的稳定，高可用性

• 提供大数据量时的分布式计算能力

• 解决单机或副本集的磁盘不足

• 解决请求量巨大时的内存不足等

优势：

劣势：

zanePerfor是什么?

zanePerfor是一个服务于性能监控的业务平台项目，目前实现了浏览器，微信小程序的相关基础性能统计。

备注：zanePerfor目前还不完善，处于开发初期，我会长期的维护和升级

展望：zanePerfor的目标是解决中小应用的性能统计，支持通用的数据统计和定制化的统计开发，解决高并发下的应用高可用

性能：目前架构理论上来说可支持每日(百万、千万)级PV，未来会持续开发和优化

网上有很多的教程安装mongodb,本文章也主要是记录mongodb安装过程（供以后安装参考方便）：

下载解压包（以4.0.3版本为例）：

$ cd /usr/src
$ wget https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-4.0.3.tgz

我这里安装到/usr/src目录下，你可以去官网下载你需要的版本官网下载地址链接：

• MongoDB安装
  
• MongoDB主从复制架构
• ......

部署测试发布环境

部署集成，正式发布环境

17年4月开发的项目，这里记录下部署说明，以备需要之需

• 理解computed如何初始化

• 理解computed与data有何关系

• 为何更改data属性值，computed相关值能监听变化

• 理解Vue的MVVM原理实现
• 理解watch实现原理
• 理解watch在Vue中的实现方式

• Object.definePropert只能新定义或修改一个对象上的属性
• 对于数组优先覆盖数组属性__proto__上的相关方法
• 若浏览器不支持__proto__则使用Object.definePropert从新定义数组的相关方法
  

• 升级openssl 
• 升级nginx
• 部署ssl模块
• 部署http2.0

• 网络性能是衡量一个项目质量的标准之一
• 用户体量足够大时，项目优化显的尤为重要
• 此文从前端开发者的视角来考虑页面的性能优化

• 反向代理
• 负载均衡
• 服务器集群

• 索引
• 事务
• 触发器

• performance-report 自己开发的一款web性能数据上报插件

• 页面性能资源上报

• 页面所有资源性能数据上报

• 页面所有错误信息上报

• 页面所有ajax,fetch请求信息上报

• 申请免费https证书
• node.js使用https模块启动服务
• nginx配置https服务，实现http/https都能访问网站

linux系统已经安装过nginx，需要时需要支持ssl模块时解决方案。

nginx: [emerg] the "ssl" parameter requires ngx_http_ssl_module in /usr/local/nginx/conf/nginx.conf 报错解决方法

可能会遇到python升级时yum不可使用

也肯能卸载了yum和python后不知道如何安装

yum报错No module named yum和No module named rpm等问题

vue2.0最大的优化和升级是对vdom的加入，性能得到提升的同时，使得vue服务端渲染和客户端渲染(weex)成为了现实，虚拟DOM只记录内存中前后两次vnode的值，而不关注界面的渲染，而diff过程才会去实现界面渲染的过程。

• 了解props、methods、computed与watch的具体实现方式
  
• methods如何绑定到vm对象
  

• computed如何初始化

• watch如何监听并执行

• Vue双向数据绑定的核心和基础api是Object.defineProperty
• 其内部真正参与数据双向绑定流程的主要有Obderver、Dep和Watcher
• 基于defineProperty和发布者订阅者模式，最终实现数据的双向绑定
• 那么Obderver、Dep和Watcher是如何具体配合工作的呢？请看详情。
  

• 了解Vue自定义事件是如何工作

• 理解vm.$on、vm.$once、vm.$off、vm.$emit的实现方式

• 理解事件机制，更好的服务于开发，父子组件，兄弟组件，非关联组件通信

• 更好的理解vue父子组件通信原理

• 了解MVVM的核心概念
• 了解Observer、Watcher、Dep，以及Object.defineProperty 的使用
• 了解new Vue() 之后数据是如何绑定

• 一个轻量级的node.js基础框架
• 支持并推荐使用async await语法
• 只提供基础的http服务和一些基础功能的封装，整个框架的核心是中间件

17年于公司来说是选择方向、占领市场、进入新零售领域的一年

于前端团队来说是忙碌、快速迭代、无数个深夜攻坚的一年

于我个人来说是理解公司业务、带领团队、初步进入前端工程化的一年

• 如何统计页面的性能数据，页面打点还是浏览器api
• 如何统计页面所有AJAX性能数据，如何知道所有AJAX已加载完毕
• 如何统计页面所有资源性能详情（包括异步ajax和图片），浏览器api能搞定吗
• 如何知道一个用户访问了哪些页面，访问深度何如，怎么跟踪记录
• 获取用户IP网络信息使用的第三方接口，如何能更好的做好缓存，解决用户每次访问都调用的问题
• 一个页面资源，ajax,js同时报错，如何全部抓取并记录下来
• 如何解决数据频繁写入数据量太大的问题，数据库应该怎么设计或处理

• mysqls是专为node.js开发调用mysql的一个封装库

• 参考thinkphp对数据库的封装api形式

• 功能强大，使用简单，api文档完善

• API链式调用，组装sql更方便

• 理解react-redux的核心思想
• 了解Provider做了什么事情
• 了解react-redux是如何把redux和react优美结合到一起

bindActionCreators干的事情太简单了，都不值得用一篇文章来说明，一句话带过的事，不过还是请允许我啰嗦的阐述一下吧。

applyMiddleware 的代码量很少，但理解起来却很有意思

随着应用变得复杂，需要对 reducer 函数 进行拆分，拆分后的每一块独立负责管理 state 的一部分。 

combineReducers 辅助函数的作用是，把一个由多个不同 reducer 函数作为 value 的 object，合并成一个最终的 reducer 函数，然后就可以对这个 reducer 调用 createStore。 

 合并后的 reducer 可以调用各个子 reducer，并把它们的结果合并成一个 state 对象。state 对象的结构由传入的多个 reducer 的 key 决定。

详细解释并测试createStore下的核心方法：

• dispatch

• subscribe

• getState

• replaceReducer

redux 源码解析方式

• 源码详细注释
• 写test案例并详细解释
• 用文章总结

• compose是redux提供的一个工具函数

做vue的开发，我总是喜欢路由单独配置到相应的模块进行配置，这样才更适合于多人开发，会更方便，也会减少冲突的出现。

此篇文章主要讲解对react-router 路由的拆分，也做到不同模块单独配置的目的。

1. 路由拆分配置
2. 路由写法
3. 路由合并

项目主要会涉及到的知识点 

• webpack 配置及其优化

• react-router 升级为4.0之后的使用 react-router-dom react-router-config

• react 构建的按需加载

最近升级了基于vue2.0+webpack1.0开发的基础cms框架，vue升级为最新2.5版本，webpack升级为3.8版本。升级过程中顺便做了下项目的构建优化，具体围绕以下几点来实践：

1. vue-loader 配置
2. webpack 外部扩展(Externals) 配置
3. webpack DllPlugin和DllReferencePlugin配置

4. happypack 多进程loader构建配置

5. webpack-parallel-uglify-plugin 生成环境多进程构建配置

6. Webpack 3 的新功能：Scope Hoisting

时间日历插件，网上有很多版本，功能强大的，功能简单的数不尽数，那为什么我还要写一个日历插件呢？

很认真的告诉你：

• 我手痒了，就是闲下来随便敲敲。
  
• 开发一个功能齐全的日期选择插件
• 根据自己的业务需求不断优化更新

声明：只做简单的部署过程，在这里不做深入原理性的讨论。文中内容仅限于博主自己的实践过程，希望对未知的同学起引导的作用。

准备工作

在部署之前我们需要具备如下条件：

1. 阿里云ECS服务器一台
2. node.js项目源码一份
3. mysql数据库文件一份
4. 通过备案的域名一个

• 考验正则能力
• 最大限度的容忍传入的json
• 提供一个参考思路

网上有很多的教程安装nginx,本文章也主要是记录nginx安装过程（仅供参考）：

下载解压包（以1.59版本为例）

$ cd /usr/src
$ wget http://nginx.org/download/nginx-1.12.0.tar.gz

解压压缩包

$ tar xvf nginx-1.12.0.tar.gz

设置配置

nvm能非常快速的安装node.js 不通版本，并能随意切换，下面我给大家介绍一下LINUX系统中nvm的安装。

这里介绍二种安装nvm的方式：

一 ：源码安装

二：通过nvm github 给出的方式安装

一：yum源码安装：

CentOS6的yum源中已经有git的版本了，不过版本比较老，版本号为：1.7.1 （一般不推荐此方法安装）

yum -y install git

二：下载git源码编译安装(已git2.05版本为例)：

查看当前系统是否安装git,有则先卸载

$ git --version 
$ yum remove git

网上有很多的教程安装mysql,本文章也主要是记录mysql安装过程（仅供参考）：

在阿里云ECS服务器上安装mysql 有几种方式，在这里只讲解手动安装方式

下载解压mysql压缩包

$ cd /usr/src
$ wget https://dev.mysql.com/get/Downloads/MySQL-5.6/mysql-5.6.35-linux-glibc2.5-x86_64.tar.gz
$ tar xvf mysql-5.6.35-linux-glibc2.5-x86_64.tar.gz

复制到/usr/local/mysql目录下

$ mv mysql-5.6.35-linux-glibc2.5-x86_64 /usr/local/mysql