始终坚守的前端年终总结

3,401 阅读5分钟

为什么说始终坚守,因为我入职现在这家公司即将迎来第 7 个年头了,在互联网行业是比较不多见的工作经历

在这 7 年里,从以自我为中心,易冲动鲁莽的小年青,慢慢的变成了油腻的 30 岁中年大叔,当然技术能力以及沟通、协作等等软实力在上级和公司的各种活动、组织中也渐渐成长,回顾当年,唯有感谢各位同事和上级的包容。

没有真正好好坐下来写过年终总结,所以准备对过往 7 年的自己简单的回顾一下

简单回顾

第一年:初来乍到

2013年3月,面试通过,顺利入职现在的公司,记得当时自己的技术能力就是只会 HTML+CSSjQueryajax 都几乎不会,面临的挑战很大,赶紧买了一本《锋利的jQuery》啃了两个周末,才算入了门

第二年:快速成长

业务做的多了,也就熟悉了,这个阶段通过做业务也可以获得足够的成长,但这个成长更多的是学习了更多的 API

第三年:第一个瓶颈期

来到第一个瓶颈期,只学习 API 肯定是不够,成长开始停滞,直到年底,在代码模块化、结构化等问题有所悟,才渐渐的突破了第一个瓶颈期

第四年:不知所措

前端的快速发展,对研发模式也带来了变革,自己刚刚在 HTML + CSS + JS 的开发模式下有所突破,就迎来了React、前后端分离、虚拟 DOM、Webpack... 等等一大堆新的技术,新的名词,可谓百花齐放,百家争鸣,眼花缭乱,在新技术的摩擦下,逐渐认识她们的脸,但一直没有认识她们的心

第五年:技术更换

React 应用了一年,在运行环境以及在开发体验上都被摩擦了 N 多遍,前端有招一个新人进来,使用 Vue 做了一个 demo,让我看到了 Vue 在开发体验上,以及语法上的简洁、实用性,与老大沟通后(PHP),考虑到趋势,学习成本以及招人情况下,转到了 Vue 的怀抱,这里不是说 React 不好,更多的是缺少一个能把 React 用好的人吧

第六年:数据结构化开发思维

开始体会数据结构化开发的好处,在开发过程中,好的数据结构设计,会大大提升开发的效率,类似后端的数据库字段设计,一切皆数据!

第七年:

技术突破越来越难,开发效率也很难再提升,梳理发现自己的基础还是不牢,开发时很多模棱两可,需要一个一个试,才能确定某个思路或者方法才是对的。

且进入第七个年头,技术上始终无法突破,技术焦虑也日渐增长。所以还是计划《高程》选取核心的几个章节,再巩固一遍,这次找了相同经历的几个前端小伙伴(其他部门),订了计划和方式,以及落地方案,从 8 月初到 12 月底,四个月的时间,完成 7 个核心章节的学习 + 思维导图 + 轮流演讲教学,下图是我们的计划表

学习的质量有高,有低,但是能从开始列计划,到最终按照计划慢慢执行,并最终坚持完成,这是我和小伙伴们最高兴的事情,说明这种形式能够继续下去,未来可期

今年做了什么

vue-cli 升级

年初,完成了 vue-cli 2.0 到 3.0 的升级工作,总体不复杂,以下是当时记录的升级步骤

投入不高,但是产出明显

PC 端图片自动压缩

三月,在 PC 端的前端构建流程内(gulp)添加了图片的自动压缩处理,之前都需要把图片上传到 tinypng 网站,然后下载,再丢到目录,如果图片有修改,还需要再处理一遍,有时候还会忘记压缩,导致直接使用体积较大的图片在网页上

实现起来也不难,主要使用gulp-tinypng-unlimited 插件

以下记录了当时的线上压缩效果

PC 前端 gulp 构建流程图

二维码生成服务更换

四月,因为 Google QRCode 停止服务,所以网站的二维码生成全部替换为基于 node 的开源项目 quickchart,后来也是基于这个项目,自己写了一个 koa 版本的实现 koa-qrcode

“小桥” 解决方案

基于 Vue 的,能够解决新旧框架相同功能,只需要研发一次的方案(公司技术峰会分享内容),截一张 PPT 在这里

flash 图片上传功能更新

因为 flash 在 2020 年将停止更新,PC 端旧框架 flash 图片上传插件和逻辑需要更换为 H5 ,目前主要的页面都有完成,估计还剩 30% 的工作量,简单看一下完成计划

很多技术上有感觉的事情都是上半年做的,下半年研发任务比较重,技术上的推进就很少了,即使上面的做的大多事情也都是基于业务来驱动的,比如 二维码服务更新、“小桥”解决方案、flash 图片上传更新

年度小结

可以看到虽然做了一些东西,但是对于一个工作七年的前端来说,这些东西都有点在挠痒痒的意思,缺乏真正有业务价值和技术成就的内容,这也是近两年一直寻找的方向,还好,方向渐渐的清晰起来,希望在未来 1 ~ 2 年有所突破

2020 年计划