盒子
盒子
文章目录
  1. 活在过去现在与未来的Web前端开发者
  2. 鄙视链底端的程序员
  3. 前端开发者的军火库
    1. Webpack: All in JS
    2. NPM: Manage Your World
    3. D3.js: 超越想象力
    4. Vue.js: 爱恨交加
  4. 最后:关于自己

前端开发的工作思考

工作进入第三个月,恍惚间就已经三个月,一个季度,四分之一年。

我不是什么聪明人,只有些愚笨的记录于此。

毕业前几天,因为Armsword的介绍,仰仗zt推荐,ztrix给了工作机会,我就糊里糊涂地去了。回顾这三个月,该说啥呢?

惭愧,时间匆匆过去,却没能做什么有贡献的事情,不知道ztrix有没有失望呢?

将一些慌乱人生里留下的混乱想法,记在这里吧。

先说工作性质的感受。

活在过去现在与未来的Web前端开发者

我觉得我生活在三个维度上,

一个蛮荒而古老的web

古老通信协议

可能比我还古老的标记语言

胡乱设计的编程语言,

层层叠叠的样式表

花式表单

冗长的文档对象模型树操作

受限的内存空间和运行效率

不一致的实现和各行其是

这一切都散发着陈旧的气息

一个现代的web

各种各样的框架如雨后春笋

层出不穷

替我们完成各种各样复杂冗长的任务抽象

为我们解决各种浏览器奇葩的兼容问题

为我们自动化整个工作流

提高工作流中每部分的工作效率

为我们提供包管理

为我们提供自动构建

终于,

为我们打开了未来的大门,

把我们推向了未来的世界

未来的标准投射到现在的工作流之中

我们开始使用来自未来的技术构建世界

我们可以用浏览器没实现的标准

我们可以试验没有定稿还在探讨的标准

我们可以让机器为我们做的更多

我们可以更好的保证软件质量

提供更好的服务

创造更优秀可靠的用户界面

我们站在未来。

这未来不完全也不完美

却仍然足够令人激动

这也是我为啥会选择web前端作为工作。

下面,是站在程序员产品设计策划与用户面前的前端开发者

鄙视链底端的程序员

有一种程序员,他要写这样的程序:

  1. 兼容n种平台各个屏幕大小n种软件的主要版本的程序
  2. 需要有严谨的逻辑来完美处理复杂的UI、数据和业务流程
  3. 需要和现有技术的局限做斗争
  4. 需要在低配置、低存储空间、低传输速度的环境下运行
  5. 要讨好所有人的眼睛的大脑
  6. 要不断面对快速迭代需求飞速变化的项目开发进度

有一种程序员,他是这样的人:

  1. 他使用人类有史以来最复杂最强大的软件之一作为主要开发工具
  2. 他需要有严谨清晰的思维逻辑,扎实稳定的算法基础
  3. 他能对项目前后端的整体理解把握,对业务流程每个细节设计了然于心
  4. 他能对美有深刻感受,他在用户体验的细节上孜孜不倦。他也是设计师、美工、用户、产品。
  5. 他需要擅长与各方沟通交流
  6. 他知道如何能将复杂的问题化为简单的问题解决
  7. 他知道如何处理大量并发事件,每一个前端开发者都是天生异步的
  8. 他知道如何调整工作节奏保持平和冷静和生产力
  9. 他在提升生产力维护代码和产品质量上孜孜不倦
  10. 他也争取在团队中做一个不可或缺的一部分
  11. 他的心里,他是个艺术家,他用手中的技术作为表达的方式

然而听说他还默默站在某个鄙视链的最底端,准备用某个胡乱设计的语言接管世界= =

前端开发者的军火库

自从进入公司,开始接触和使用一些好使的工具。有一些只能说非常喜欢:

Webpack: All in JS

自从有了webpack,恨不得什么都让javascript来接管。webpack赋予了前端开发者一种,
使用javascript管理一切静态资源及其依赖关系的能力,极大减少了重复无益的体力劳动
和出错的可能。

有很多好处:

  1. 资源按需求引入和导出,想怎样就怎样
  2. 开发环境和生产环境几乎一键切换,
  3. 前后端分离,自动代理
  4. 热更新
  5. 各种预处理很方便加入工作流

NPM: Manage Your World

难道现在前端使用到的库的安装不都是使用包管理器(NPM软件管家)来安装和维护更新吗?
然而,NPM也可以用作简单的任务管理器来跑测试和启动开发环境服务器。

我听说有些爱折腾的小伙伴构建了一个使用npm作为包管理器的linux发行版= =

好处不用多说:

  1. 方便下载和管理和更新依赖的前端类库
  2. 方便自动化常用任务管理
  3. 与全世界共享你的作品

D3.js: 超越想象力

可能大家更喜欢echarts, chartjs, highcharts等等等等。相比而言,工作上,
人们看重的可能更是生产力和工作效率。还有对较成熟产品的信赖。

我唯独喜欢d3,喜欢的无以复加。webpack可以没有,npm可以没有,jquery可以没有,
但,d3如果没有,工作生活一定少了亮丽的风景线。

那是我见过最优秀的前端类库之一,几乎没有之一。

它只做了它该做的事情,它好像什么也没做。

它把复杂底层的事情又抽象出来了,它却没限制你的想象力

它是艺术家和数据可视化工作者无可比拟的工具

它的稳定、灵活和自然而然的设计,

是一个痴迷数据可视化痴迷绘图的人梦寐以求的东西。

不过我还是被吐槽了,因为,照设计稿画出来大家不满意。

所以:

pros:

  1. 可靠。最流行的数据可视化前端类库
  2. 灵活。超强的定制性,因为,它几乎没做什么
  3. 数据驱动。将数据映射到DOM结构上,一个先进的思想和设计
  4. 工具库。很多现成的东西来帮助完成冗杂的事情,方便完成数据到图像映射
  5. 解耦好。d3各个模块是可以分开使用的,解耦非常好。

cons:

  1. 不是图表库偏底层。人们会觉得你用现成的图表库能画得更好更快,虽然我不完全这么认为。
  2. 命令式地操作。这种jquery风格也算优点,但和同样数据驱动的Vue结合就比较难过
  3. 整体看并不小。d3整个是149kb, echarts2 372kb这种,echarts3 171kb, chartjs 31kb

so, 你的选择是什么呢?

我选择d3,我觉得这是不可多得的好东西。我可以用把数据映射到html,svg,canvas,webGL和能
想到的,js能操作的任何地方。相比限制到某个小圈子里调整给定的参数,d3属于自由灵性的艺术家。

当然,砖还是要搬的。

Vue.js: 爱恨交加

在heavily use vue.js in our nearly every products web UI 后,我司成为某Vue的赞助商了。

说下体验:

pro:

  1. 组件化开发方式,seperation of concern
  2. 活跃的开发维护和活跃的社区
  3. 公司在支持该项目
  4. 数据驱动
  5. 方便的指令系统、数据绑定支持
  6. 现代而完善的前端开发测试工具支持

cons:

  1. 组件化并不完美。要理解其工作原理
  2. 依赖关系复杂到一定程度难以调试。这说得好像其它解决方案很好似的
  3. 想要在组件内注入样式比较难过,没什么人用css in js方案,没all in jsx的一致感
  4. 和现有类库的配合并不天生契合。

最后:关于自己

几点愿望:

  1. 注意身体,穿插工作与休息,保证锻炼时间。保证生活规律。
  2. 调整心态,保持平和冷静。
  3. 提高沟通效率
  4. 提高工作效率

然后,我睡觉了