记忆力一直不是我的强项，但有些东西总是值得回忆的。记录下前端生涯走过的路，获得的进步。多年以后再来看看也是一件十分有趣的事。
初战：一个复杂的流程系统
说它是初战是因为这是第一个，我作为唯一的前端负责开发的系统，在此之前也做了一些打杂性的工作，比如说学习了vue，改了改另一个系统的ui，参与了又另一个系统的接口联调及页面开发，也许是前端缺人，也许是同事老板的信任，也许两者都有，这个任务落到了我头上。
这个系统主要考验了我的程序思维，以这个系统中的一个流程来举例，一个流程至少有17个步骤，每个步骤可能由不同的人来操作，并且有并行的操作，即同一个步骤可能有多个人来完成，这样结果也就从单个变成了数组。同时，需要把这17个步骤放在6个页面当中，这就需要判断在这个页面中执行的是第几个步骤。在这样的一个流程中分为两条线路来操作，分别是填写流和审批流。当你处在填写流时，你可以执行的操作是提交，暂存，返回。竟然还有个暂存，这是不是意味着我还得把写的东西存下来，放进草稿。当你处在审批流时,你可以同意，驳回，转办，加签。这个加签也是比较烦的东西，因为加签后流程的步骤没有改变，但是加签的人可以输入意见然后提交，提交后在审批记录中有加签人的意见。而且这是一个长流程，在流程的后期你也得看到前面的流程。
总之，经过这个系统的洗礼，我感觉技术实力有了很大的进步，比如下载文件的操作、echart的操作（后期有报表）、判断超时时间是前端设置的时间超时取消调用还是后端的ngix服务器超时取消返回给前端（这样就能愉快的甩锅了）。再比如如何在页面切换时刷新，如何优化点击同一个流程时会返回已打开的流程而不是再次重新打开。熟悉了下ant-design-vue，和vue，vue-router，store等。
再战：一个订单系统
虽然上一个系统的业务十分之复杂，我也把它做了出来，但是一看单单一个页面的代码量，我的天！竟然有两千多行。显然这是不行的，在这个系统里，我得改正。于是组件化开始了。每个页面大致都有一个高级检索，于是把它做成了组件。在这个组件中添加了键盘快捷搜索，展开收起，页面自适应。把所有的搜索表单表单都放在一个组件内，通过name判断是否应该显示。这样我就能方便调用数据字典接口，为了更方便的调用数据字典，实现了只要在一个数组中加入一个单词，就能自动调用该单词的数据字典。
同时学习了一些组件通信的方法，比如如何暴露组件函数，作用域插槽的运用，子组件使用外部方法后接收结果进行再处理，利用这些知识做了一个动态增减表单项组件，成为了博客的内容。
git上的提升，能比较熟练的运用git操作，从之前的fix，merge提示记录改成符合angular团队规范的提交记录格式，从此每一个项目的gitlab都能成为航海日志，并且减少了分支至2条，一个是master一个是当前版本的分支。
一个比较快速的项目
这是一个知识教训库，在这个项目中的提升主要是弄清了env配置，组件运用更加全面，没有再出现一个页面复制到别的页面的情况。
用时三个星期，也算锻炼了自己快速实现的能力吧。
一个改密码的项目
在上一个项目和这个项目中间学习了一波webpack，所以这个项目的技术含量会有一些提升。首先此项目要在手机端和电脑端显示，通常我们会启动两个项目来分别写手机和电脑端。但是这个项目并不大，我用了一些css技巧识别了手机和pc的区别（没有用宽度识别）。在媒体查询下分别写他们的css，做到了一份代码，多端使用。然后就是国际化，rsa加密，并照着友商的改密码项目手写了一个人机校验插件，并把rsa功能放进该插件里。于是取名叫做rsa-verify，现在能从npm搜到。
优化的部分也从减少包体积入手，比如去掉不必要的包，cdn加速，从首页渲染速度入手的优化有包分割，ant-design-vue的按需引入，ant-design-icon的按需引入。
期间读了本身框架的路由逻辑，因此能比较从容的改路由白名单，防止地址随意跳转，也能配置与后台交互时header的属性。
空闲时学习的知识
正则
在改密码项目中修改密码用到的各种规则都是用正则办到的，正则就像一个好用的工具，就要系统的学习，之后对项目的影响也是潜移默化的。
svg
其中学习了svg如何绘制图形，如何制作smil动画，svg滤镜，其中使用了svg滤镜动画在改密码项目中做了一个噪音滤镜改造过的水波纹点击动效，不过惨遭ui删除555。到底啥时候能有他一展身手的机会啊。。。
canvas
只会照着api用，解决了一个后台传过来白底背景图片放到蓝色基调的页面不好看的问题。解决方案是这样的：白底=>黑底，就是图片数据扣到canvas上，形式是一串长一维数组，规律rgba，改rgb，值=|255-数据|。有了一个黑底的图片。放到页面上。再利用滤色模式screen规律，黑色碰上别的颜色计算出来的值都是那一个别的颜色。于是mix-mode-blend：screen；加上background-color：需要的颜色。其实还可用svg滤镜实现，feColorMatrix滤镜的luminanceToAlpha模式色调翻转，白边黑。feFlood蒙上需要的颜色。feBlend的mode设置为screen将两者的结果结合生成最终的滤镜效果。这种方式不需要改动页面，只需要在外边放个svg滤镜输出id。在该图片的类中加一个filter:url(#id)即可。
学习来源
阿里来的带我的师傅，姓康。也是我真正意义上的技术入门导师，所以我叫他师傅，而不是康师傅。
张鑫旭博客，张鑫旭css世界，张鑫旭选择器世界
mdn，css tricks，html草案，css草案
javascript高级程序设计第三版
下一步的方向
由于在大二起我就看了张鑫旭的博客一路走来，所以css基础应该算是不错的。我会从javascript入手再巩固一遍基础，我买了高性能javascript，和你不知道的javascript上中下这四本书来阅读。
会尝试滤镜的更多可能性。
从项目角度，希望解决service worker离线缓存带来的项目上线后再次上线用户需要清缓存才能看到更新的问题。
