Records
2012年
8月
9月
完成了人生中的一件大事：结婚。
我和老婆的两个导师竟然专程开车过来参加结婚典礼，实在是太荣幸了！刚开学没几天，不是周末，4、5个小时车程，就为了过来给我们的喜事作个见证，师恩难忘！！
还有好几个同学也来了，检讨来的时候都下午了，连婚宴都没赶上，在家里吃了点喜饺^-^
之后跑昆明，丽江玩了一个星期，算是蜜月啦
工作
主要将前端svg系统跟后端进行联调，顺便优化了下交互逻辑，比之前清爽多了～
之前svg的currentScale在webkit上实现不能，导致chrome，乃至Android，iPhone都不能正常运行。本来一直期待chrome团队能给个解释，都等了快一年了还是没信。这次终于下狠心，参考svg-editor进行了重新实现，计划加入到下个版本中。
尝试将svg系统移植到移动设备上，发觉移动设备和传统浏览器在交互上还是有很大的不同啊，比如touch事件，比如mouseover事件，比如鼠标滚轮...还是针对移动端进行定制开发比较靠谱。
其他
利用晚上时间看完了
《Ruby元编程》
这本书，学到了各种魔法技巧，希望可以有机会订制自己的DSL。
10月
主要在之前应用经验基础上对kjsvg库进行重构
在项目过程中发现，Bootstrap在IE下的表现相当的不尽如人意，与ASV协同使用时甚至会导致CPU瞬间占用100%，造成IE崩溃。最终痛下决心还是使用jqueryui代替，顺便重构了前端界面。
对kjsvg库底层进行重构，core提供svg加载、DOM操作和事件处理，常用功能分模块开发，各模块在kjsvg中统一组装供业务层调用，未来针对不同业务应用可能要配置不同的kjsvg。
重新梳理组件库架构，所有组件继承于control类，使用集合controls来控制。控件之间使用Class库实现继承。
重构之后，项目结构更加合理，对未来功能开发更有信心！欧耶！
11月
开始妄图构建自己的前端框架!
领导要求对原来基于Extjs的项目的运行速度进行优化，然而经过多层面反复调优效果依然不明显，尤其对于老旧IE来说。痛定思痛，Extjs界面对于企业开发来说非常专业，就开发速度来说也是一流的，但是其使用js生成一切的想法，在IE面前纯粹是在搞笑，而且封装着实紧密，进行功能扩展着实有点束手束脚。因此萌生了借鉴Ext的UI自己封装模块的想法。
首先用了一周时间将常用界面元素从Ext中抽出，本着KISS原则，同时考虑一定的业务扩展性，借鉴之前了解的
smacss
、
OOCSS
，很快完成了任务。
然后对常用组件进行js封装，基于
arale项目
，目前已经完成Tree、TreeGrid、Tab，Accordion、Grid，本着持续集成的想法搭建了集成框架，效果不错。
基于一流模块，而不是框架，针对自己的业务需求，订制通用内部模块，搭建自己的前端集成构建流水线。
开源
学习使用
spm
打包部署的方法，发觉alipay团队真心给力，发现问题后在github上提一下
issues
，开发人员往往在几小时之内就能给予答复，怒赞！
第一次提交Pull Request并被采纳，还是vim插件
vim-jsbeautify
。很惭愧用了两年的vim，对于其插件开发还是一知半解，了解一下还是挺有意思的。
Open Source的人真是挺nice的，分享使人快乐！
其他
kjsvg项目解决了直接载入svg文件的问题，极大的扩展了系统的想象空间，例如控件不失真缩放、底图分步加载、各系统作为插件独立加载等。
终于下决心开始看
犀牛书
，对自己的js知识体系进行查缺补漏，作为一名靠谱的前端，这貌似是必须的吧。截至月底第一部分“JavaScript语言核心”达成！
虽然整天看英语文档，但是感觉词汇量还是自己的短板，找到一个
好网站
，希望能够坚持下去。
12月
信息化系统前端框架
完成弹出窗口dialog，实现标题栏拖动，封装alert，confirm，show三种常用样式方便调用。
基于
calendar
封装日期选择控件date-picker，可以基于页面配置直接autoRender
完成下拉选择控件choose的基本功能，调用悬浮组件layer进行展示，为后面各种复杂下拉查询选择做准备。目前已经实现静态指定项的下拉选择和基本的后端json数据选择功能。
重新设计表单中控件的布局方式。原来采用Ext的table布局方式，结构变更比较繁琐；现在借鉴
bootstrap的布局方式
，使用row来布局行，span布局列，针对常用列宽指定不同class，并优化各种控件的显示宽度
借鉴
Mozilla的规范
对已完成的css属性的顺序进行调整，规范了Hacks方法。
重构css样式，使用
LESS
封装常用CSS属性。目前保证框架在Chrome、Firefox以及IE8以上浏览器中可用。
完成下拉选择控件，多选控件，自定义下拉控件，工具条，多级菜单，多选树的css样式
通读Arale底层四大模块
class
、
base
、
events
、
widget
的源码、测试用例。
svg图形展示系统
实现了多应用系统的统一配置、管理、展现、编辑等功能。
原来的keydown事件响应使用jquery.hotkeys.js库，后来发现采用这种方法附加的按键事件会互相影响，而且绑定后无法单独取消。经研究发现这是因为其没有考虑svg独有的document问题。因此重写了按键事件响应代码，目前可以绑定Del，Esc两个键盘事件，并可以分别解除绑定。从而解决了原来系统的按键冲突bug。
将拖动图元改变其位置的功能合并到系统中，当拖动完毕时通过自定义事件触发来保存坐标位置到后端数据库中。
与后端同事讨论登录权限验证问题。后端提供的REST接口无法调用session，因此无法使用传统的权限验证方式。为解决此问题，开始研究
豆瓣网的开发平台API调用方式
。研究发现开发平台使用OAuth2方式向第三方平台提供接口，第三方平台需要事先申请API Key和Secret Code，然后使用API Key获取authorization_code，然后使用API Key，Secret Code以及authorization_code获取access_token，然后在所有的权限操作的header中添加Authorization:Bearer access_token，这样后端就能根据access_token安全的进行操作。这种权限验证方式是目前业界流行的规范，但是对于我们自己平台的REST调用来说有点繁琐，可以将流程进行梳理简化，从而应用于我们的平台接口调用过程中。
其他
读完
Hacking Vim 7.2
，重新整理了vimrc配置
试用了下
Sencha Touch
，走了一遍
PhoneGap
打包流程，使用这套东西开发个演示玩具貌似是挺简单的事情，但是作为产品方案的话还需要慎重考虑。
2013年
1月
svg图形展示系统
在对原有系统进行功能扩充的过程中发现，原有系统API设计不够完善，代码抽象也不够合理，导致高级功能开发比较困难，系统架构也不够灵活，适应性不强。因此开始在开源库中找寻解决思路。
Raphael
是一个相当成熟的SVG开源库，主要被用来做图表显示。它的核心优势是在低版本IE（IE6、7、8）中使用原生的VML，现代浏览器中（IE9、10，Chrome，Firfox等）中使用SVG，因此不需要安装其他插件就可以实现桌面浏览器中的图形显示。最大的问题是所有图形必须通过它的API动态生成，这样对于矿图展示来说初始加载速度会非常慢，因此之前没有选用。
起初想借鉴参考其API设计，用于补充自己的kjsvg库。后来在研究其源代码时发现，其代码架构非常完整，包含许多高级图形处理功能，而且调用比较简单，业界用的比较多，因此考虑是否直接基于Raphael这个库作为我们图形展示系统的底层库进行开发。
然而在研究过程中发现，IE下的vml实现貌似有问题。vml中图片放大两倍时浏览器内存占用也会变为两倍，从而在图片很大时直接导致系统卡死，另外还有一些其他问题，因此直接基于Raphael库作为图形展示系统的底层库这条思路可以说是失败了。
因此采用第二套方案，就是借鉴Raphael的API设计，基于ASV插件实现IE下的SVG控制。这个方案本质上是对Raphael库的移植，难度主要在于要基本看懂这个库的主要代码，并按照我们系统的实际需求增加新的功能。
在移植过程中，借助seajs对代码架构进行了重新设计，独立出matrix、set、color、pathtool、animate、easing、tool几个通用函数库，保证代码的高内聚低耦合。
为了保证移植的正确性，采用mocha进行单元测试，优先覆盖项目所使用的API。
期间还遇到几个源码中的bug，在官方issues中都有人已经搞定了。
目前移植基本完成，功能扩充比较之前灵活了许多，但是由于多了一层抽象封装，性能依然不理想，要想投入实际应用还得继续研究。
阅读
《高性能JavaScript》
相关章节，寻找JS代码优化的方法，试图解决操作不够流畅的问题。
其他
继续配置VIM，在家windows上也可以使用了。
2月
svg图形展示系统
另一个部门项目也要使用本系统，但是需求与原来的功能设计偏差不小。因此需要对系统进行重构，并且提供订制化的解决方案。
其他
看完
《高性能JavaScript》
，
《批评中医》
， 重新鼓起勇气看
《算法导论》
对node又一次起了兴趣。看了些
nico
，
nodejs-express-mongoose-demo
的代码
读了些源码
underscore
，
jquery
，pull了几个request，希望能采纳。
3月
kjsvg
同时负责两个系统的svg接入工作，已经基本完成。
IE9不支持svg动画，自己实现风扇转动
实现动画队列
找到更简单的轨迹移动方法
实现宽度自适应
kjui
综合考虑维护扩展和实际使用的需要，对原来的extui框架架构进行了重新规划，更名为kjui
将css部分独立出来，方便针对不同项目更换不同的样式。
将每个组件作为一个仓库来维护，方便灵活调用，也有利于独立升级。
对组件文档模板进行更改，目标是在局域网或者外网环境下都可以正常访问。
最终结果是产生了好多库。简单罗列一下，有 综合示例:
kjui-static-demo
， 基本组件:
kjui-accordion
，
kjui-date-picker
，
kjui-dialog
，
kjui-grid
，
kjui-tab
，
kjui-tree
， 仿ExtJS样式:
kjui-extui
， 文档模板:
nico-kjui
， 以及供外部调用访问的组件库:
kjui
，
其他
认识了几个牛人，看清了自己的不足，继续努力！
为jquery，underscore提交了pull request，包括：
jquery 1
，
jquery 2
，
underscore pull 1027
， 目前都已经被merge了，还被列入了jquery authors，开心！
给LP的小礼物:
love
, 并使用Phonegap打包成app
总结遇到的CSS问题:
css-demo
使用socket.io做了一个简单的实时游戏:
realtime-game
， 并部署到
heroku
中
4月
kjsvg
终于完美解决自适应宽度、高度问题
搞定IE下插件安装的检测方法
kjui
重构css样式，解决大量IE6的兼容性问题。目前测试浏览器为：IE6，IE8，Chrome
kjui-grid增加分页显示控制，自动编号列，多选列，自定义按钮，数据量超过显示区域时出现滚动条
kjui-tree包括多选，级联选择，复杂自定义级联选择，自定义图标等
边开发边封装组件：
kjui-demo
。Done is better than perfect!
其他
项目功能：按年显示的日历，要求需要区分工作日和休息日，并通过自动浮现按钮实现两种状态的切换。 借助
moment
轻松实现
year-calendar
。 开发过程中尝试了下
Yeoman
， 以及三兄弟
Yo
、
Grunt
和
Bower
，还有
sass
和
Compass
，发现真是神器，值得进一步研究。
imageMagick是神器，用来进行图形格式转换，各种裁剪拼接非常简单，而且是基于命令行的，太赞了！
开始跟coursera网络课程
Algorithms
，希望能够补上我的算法短板
忽然发现兼容IE6也不是太难的事情啊！
5月
kjui
kjui-grid采用新的定宽方法，可以显示复杂表头
kjui-tree直接继承于grid组件
kjui-dialog增加静态方法form，方便直接弹出表单窗口，并默认使用autoRenderAll来将所有组件实例化
kjui-calendar自动将一般的input变成日历组件，增加时间选择功能，解决点击页面组件不消失的问题
使用
spm2
进行发布
其它
研究响应式框架
foundation
，适合开发Mobile First的应用
研究Google的标记式前端开发框架
angular
，适合开发单页面CRUD