做前端真累：写给其他职能看的前端述职 (吐槽)

年终总结又到了，一年里什么都没做，都在和恶心的逻辑撕咬搏杀，如此也没有什么技术提升。拖延症无心应对年终总结。回想过往，想出了这篇东西。打工人总结 2 个字就是“心累”。那么前端累在哪里呢，让我们带着轻松愉快的心情，一起来回顾一下：

1 逻辑不正交。数据和样式布局必须在页面上通过耦合以实现。我不是单说 css ，而 js 你也负有责任。web 页面的排版布局的本质就是遵照依靠耦合关系，牵一发则动全身。(所以目前被广泛使用的布局排版套路都是很简单的，比如 flex 一把梭，套多一层元素绝对定位一把梭)。其次，css 的逻辑也不是基于正交的法则的，调节样式需要综合几个样式的知识和特性，调个居中需要磨半天。

2 整合数据流逻辑恶心。分别从 A 、B 、C 等各处接口大乱斗大杂烩取到数据，格式各异千奇百怪是常态，一顿数据格式处理，糅合。(有数据格式洁癖的不要做前端。)格式基本上都是后端定义，各个后端格式不一致或者格式不好用，都到前端这里整合。前端 app 代码里面数据流乱如麻，字段的有无也是乱如麻，页面效果还要保持洁净，能做前端的都是些什么神仙。数据到达的时间也是要有讲究做处理的，不然数据没法用。开发一些大型应用，整合数据、数据流恶心是难以避免的。

3 大型应用的联动功能。一个地方的数据变了，其他地方联动显示数据。虽然说花多点时间是绝对没有技术难度实现的，但是就是恶心费时间啊。我滴妈呀。多组件数据联动。带 checkbox 的树形图父子联动。带 checkbox 的多选的树形图联动，外加根据业务逻辑联动勾选，外加重写为懒加载的勾选联动，还有些这个表格项展开里面也需要联动的。乱如麻。麻了麻了。

4 难封装，自暴自弃，没什么领域积累。封装通常是程序员的基本素质嘛。而实际上前端很多东西是不如后端和数据库规规整整，想封装其实是封装不了的，甚至被封装反噬。这才是真正的“代码分布式”啊：代码到处分布。改一个需求不就搜索字段改半天了嘛。封装东西，需要处理的不单指是数据，而是数据样式的混合体。很多工作量是没有办法通过封装绕过去的。前端是最末端，业务逻辑没法封装啊，都被外界打破封装的可能性，没封装的话自己搜代码一个个改呗。

5 页面逻辑难以文档描述，对项目可维护度造成威胁。看前端“吹了这么久页面集成单元测试，而没有几家是实际做成的”，就知道了，这种东西耗费大量人力物力，收益很浅。页面逻辑难以文档描述，接手一个代码，理解起来特别困难，页面逻辑放飞自我。单元测试，可欲不可求。心中敬仰的永远是不可逾越的屎山。

6 业界没什么进步和积累沉淀。不断重复历史，没意思。某些厂拿出所谓的“积累沉淀”出来开源，笑死，都是自用的来强硬开源，不推广怎么有 kpi 呢，心知肚明轮子只够用那两三年，抓住时间机会晋升，实用性的确是呵呵。更新换代一次又重复一次历史。

7 兼容性问题。略。够你玩半天了。其实这也是大头。

8 多端多能。各个客户端开发职能归于前端范畴，还要保持各端样式一致性。各大公司开发自己的样式组件库，vue2 来一套，vue3 来一套，react 来一套，别提多恶心了，但是无可避免。这不得组个大团队？不断重复历史，没意思，请问一大群人搞这一两年有啥进步吗。多端开发其实每个都够一个人十年研究吃一壶的，很不幸过 5 年你这个端会不会被时代抛弃都是未知定论。这也导致了没什么领域积累：当你开发一个东西解决某个业务问题，人家开发框架的窜得比你还勤快，赶紧适配人家的框架吧，star 数正在往下掉了。

前端能吃到的甜头：

语法新特性是一马当先快速推广的。有编译器在，语法飞速更新换代。

启动代码应用编译调试起来，是相对比运行起来较快的。

git 代码协作相对于其他职能还是比较和谐的。

和前端妹纸四手联弹，指点江山，不错不错。

snoopyhai

2021-12-31 08:42:20 +08:00

@shilianmlxg 巨方便。
tailwind 之前，
都讲究 css 复用，多个地方，样式相同（相似）、结构相同（相似），共用一套样式。
写的时候挺爽，维护的时候就灾难了。

比如说共用样式的区域，有一个地方要改变设计。而且是上线 3 个月之后，你压根就不记得定义的这些个 class 能不能直接改，会不会对别的地方造成影响。唯一的办法就是为变动的设计从新重新起名，加一套样式。

上面的事情，随机来个三五次。你的样式表就没法看了。。。

tailwind 不一样，哪里变，就改哪里，只管改 className ，不会对背后的样式做改动，也就不用担心会影响其它地方。

tailwind 其它就是把 className 对应的样式打散，做细。感觉没啥用，实际用起来缺超乎想象。
前提：你要对 css 足够熟习，用 tailwind 才足够顺手。