想看科技类的，往下翻到后面的重头戏。一个活动页是2015年底加入罗辑思维的，刚来不久，他就接手了一个活动页，在微信朋友圈里传播。效果页大概和当时锤子手机的活动页差不多，但是又不一样。更何况是用Vuejs写的，单个页面踩了不少坑。填坑日记上传html5本地图片，处理各种问题。临时在github上上传了一段代码，地址如下：http://leslieyq.github.io/204...2015年底到2016年初和朋友一起建了一个网站，好朋友在我大学@叶少城_的提议下，我们做了一个专门做CodeReview的网站，网址。之所以这样做，是因为CodeReview很重要，但很少有公司重视。大家认为很多时候，没有bug，就不会在意这些东西。而我们认为CodeReview是让你清楚“如何写出好的代码”最快最有效的方式。所以一些有相似兴趣的人想出了这个网站。虽然现在已经不再维护和运营，但它在当时仍然充满着激情和想法。从这个网站开始，一个变种的想法诞生了，我们当时的合伙人之一李志伟做了一个新的网站，叫做趣直播科技直播网站。这很有趣。如果您有兴趣，可以查看一下。我也在里面直播了一个前端技术，虽然听的很多都是IOS开发者，直播地址：1024是偶然的。春节再去马尔代夫，就没有回老家。我和我的妻子以及好朋友一起去了马尔代夫。这是我第二次去马尔代夫。上次是2015年8月度蜜月的时候，说说我为什么又去马尔代夫。去一次，觉得值得再去很简单。我不太喜欢它。那种到处走走看一眼的旅行，真的是到此一游的感觉。相反，我更喜欢慢节奏的旅行。也许它通常节奏更快。我只是想出去玩的时候放松一下。不要去太多的景点，体验各种人文风情，找一个风景好，环境好，让人心情舒畅的地方，每天躺着吃喝玩乐休息才是最好的放松我起来。这次旅行，好朋友有一篇专门记录的文章，也是他第一次出国。马尔代夫之行的重头戏---今年的工作情况，个人感觉这一年做了很多事情，主要集中在我们公司的前端领域。同时，我也给整个技术团队提了很多建议，介绍了很多新的东西和方法，总结起来有以下五个方面。1.推动了整个WEB前端技术架构体系的演进目前我们公司的前端技术架构体系首先说明我们现在的项目基本上（除了少数特殊的）都使用Nodejs作为一个相对薄的中间层开始。这是一个基本情况，有利于理解我接下来要说的内容。不同层级在做什么，决策时怎么想的：接入层分为两部分（静态和服务端），静态资源的CDN，因为我们是部署在阿里云上的，所以直接用的是阿里巴巴Cloud的CDN服务。不得不吐槽阿里云的CDN服务不是很稳定，没有自家的淘宝CDN强大。服务端使用Nginx在外层提供HTTPS服务，反向代理我们自己启动的Nodejs服务，使用阿里提供的多机负载均衡服务来保证项目的稳定性。代码层，浏览器端代码，基于Vuejs编写。同时使用自己开发的Radon-UI组件库拼接页面元素，开发效率快速提升。服务端Express核心框架，结合Thenjs解决异步问题，Request代理API服务，Render页面到浏览器。根据页面的业务需求，有两种情况，一种是渲染头尾，然后JS异步获取数据渲染页面，第二种是渲染整个首屏页面，以及一些弹出层或者DOM由js管理。对于一些特殊的系统和页面，Nodejs承担了更多的任务。比如我们为运营开发了一个事件页面生成系统，用mongoDB存储运营填写的文案和上传到阿里云OSS的图片地址。还有一个我们获取APP订阅文章的红包分享项目。为了存储用户信息，使用Redis来存储session信息。工具层，这里我们有一个Yeoman生成器，可以直接生成新项目的各种配置和基础代码文件，使用webpack进行开发打包构建，给我们的静态资源加上Md5戳，增量部署到CDN。之所以同时使用Gulp，是因为很多老项目还在使用，还没有完全切换过来，但是现在正在逐步切换。使用Sass和Babel提供了CSS的模块化并提高了CSS的可维护性。Babel给了我们在开发环境中直接使用ES6的可能。NPM是项目的包管理，我们构建了一个私有的NPM源来保证更新包时的速度和稳定性（记得AzerKo?ulu删除了他所有的npm库）。部署层主要是运维的地方。对于我们的前端来说，主要是静态资源的部署和Nodejs代码的启动。我们使用自己内容搭建的部署系统来解决这个问题，加入权限管理和回滚机制，使用增量部署静态资源，省去无缝切换，先部署静态资源。服务器采用替换部署机制，即在负载均衡方面，先启动一台机器，部署另一台机器，然后再上线负载，如此往复，直到所有机器都完成。确保服务稳定不间断。监控层，这里有很多东西，有第三方的，我们自己开发的，而且是开源的。关于服务端告警，我们使用Sentry来监控错误。一旦发生错误，我们使用哨兵向相关人员发送电子邮件。可以立即知道错误的位置和原因。同时，在性能方面，我们使用第三方OneAPM来监控性能指标，让我们知道哪些页面加载慢，需要优化，优化点在哪里。Nodejs有个问题，就是进程监控。这里我们选择PM2做进程监控。一旦save线上的进程出错崩溃，服务可以自动启动，服务不会卡在那里。另外，利用Log4js将日志输出到已知文件，再利用阿里云的日志服务监听日志文件并输出到日志服务系统，这样在外网环境下就可以直接看到日志的详细信息和来龙去脉，这非常有用。最终我们搭建了一个Foundation前端系统供自己使用。主要目的是提供一些我们自己部门需要的服务，包括收集操作日志和文件上传功能。将来可能会提供更多功能。以上架构是根据团队的人员配比、技术水平、业务需求来搭建的。不一定非要追求所谓的高级、所谓的完美。很多时候都要综合考虑。这个架构和美团酒旅的前端技术很像，但又略有不同，少了很多东西。大家看的时候可以互相参考，根据自己目前的业务形态和团队技术水平，搭建公司的技术架构体系。2.主导我们公司自己的组件库在适当的时候，我主导开发了一个基于Vuejs的公司使用的组件库，并最终开源。开发这个名为Radon-ui的库的目的是：帮助您快速开发一个简单易用、效率高的产品Vue组件库，让您免去各种定制的烦恼。这个库的一些具体原因和后果可以在我的文章中找到。简单点就是为了满足我公司的需求，开发一个开源的组件库回馈社区。那时候vue的组件库确实是一片空白，当然后来也出现了很多。各种组件的类似库。3.开发了定制的文章编辑器我们公司从2016年开始，有2个不同的业务线，一个是原来的微信♂，罗辑思微，一个是获取App，主打知识分享。提供省时高效的知识服务。用过我们拿到的App的人应该都知道，我们有一个订阅栏，里面有订阅的文章可以看。本文的技术栈是web的前端，包括编辑器、展示，以及里面的各种操作。一开始用的是百度编辑器，后来遇到了很多问题，主要是自定义、样式、字体的问题。所以后来为了提供更好的阅读体验，我们重新开发了自己定制的编辑器，融入了特殊的字体切割技术，大大提升了整体的阅读体验和效果。为此，我写了两篇文章：富文本编辑器总结性能优化之旅4。鼓励前端的大家参与D2技术分享。在一个阳光明媚的下午，我们的前端团队召开周会，讨论本周的活动技术问题，收到D2技术论坛开始注册的消息，于是趁热打铁，鼓励大家参与这个分享。团里一共有7个人，直接就报名了，然后订了机票和酒店。具体讨论可以去知乎阅读：参加第11届D2前端技术论坛，你有什么收获？对于这届D2，说实话，我很失望。感觉不如上届了。广告满天飞，都是比较简单的东西，没什么深度。但是还是引发了我对前端的思考，比如是否应该和Native一起考虑App的各种技术集成方案，Weex技术的跨界，以及UC浏览器中UC头条的性能优化。比如美团人的思路：前端统一5.保持一定的技术文章发文频率和质量。算上他们的15年，一共出12篇，基本一个月一篇。有一个系列叫做《如何打造一个令人愉悦的前端开发环境》，这个系列有不少人看，还有很多公众号转载。在segmentfault中，还获得了第三季的TopWriter。这已经养成了我的习惯。如果我发现有趣和有意义的技术点，我会记录下来并与大家分享。这也是一种梳理。各方面的发展，以及我自身的优缺点，需要改进的地方。这样的梳理催生了16年最后一篇技术文章---拆分前端工程师，这篇文章也被百度FEX周刊收录，收录了很多前端相关的公众号（前端早安读书班，前端大佬--infoq，野狗等），很欣慰，是对我莫大的鼓励和认可。不断产出一定质量的文章，也带来了另一个意想不到的收获，那就是一家出版社找我出书。虽然两个不同的人还没有写出来，但主要是不知道写什么，不敢写。不好，耽误了有志青年。同时，我还在录制一些MOOC的教学视频，希望早日上线（说不好的不要打我）！！！到头来，互联网的路没有尽头，只会一直跑下去。不忘初心，不惧未来！
