2016 年做前端开发是什么体验?混乱+开倒车,这是我的体验

2016-10-18 09:16:02 +08:00
 murmur
有人说,你有什么资格发表这种高谈阔论,实际上是这样的,我在看 lol 比赛直播的时候,有个很有名的主播说过,打到 2400 以上的都去做职业玩家了, 1800-的还在挣扎,只有 2000 徘徊的才出来做主播,的却是这样,如果你是一个能力很强的程序员,你可以驾驭任何新技术、框架,那么你的牛逼可能掩盖一些真正的问题,但是有些人偏偏把问题说成 feature 。

很多前端开发以鄙视 jQuery 为荣,以 jq-free 作为吹资,这是没问题的,因为如果你的目标是 IE9+,或者移动端, MVVM 框架可以让你不用 jq 。但是,我们来考虑 2 点,为什么强迫用户升级 IE8 到 chrome ? win7 是如此优秀的操作系统,网吧的电脑,甚至很多办公电脑都是 xp ,大量的网站兼容了 IE8 ,用户就是上帝,我们有资格要求上帝无缘无故升级浏览器么?很多程序员鄙视 360 ,但是你们真应该好好感谢 360 , 360 用一种比较温和的方式让大量用户升级了有 chrome 内核的浏览器,相比之下 YY 简直是强奸用户一样,在后台做不可告人的勾当。

那么接下来说 JQ 优秀在何处, JQ 不是框架胜似框架,而且我希望每个产品经理都学习一下 JQ , JQ 的使用量绝对不是偶然,首先 JQ 的 api 设计非常优秀(用$代替所有选择器是太牛逼的设计,当然这里也要提一下underscore的下划线),这个比起开倒车的 fetch 不知道高到那里去,我也用过 axios , axios 在 get 和 post 下用一个用 params 一个用 data ,这是语义要求还是标准要求的呢?我不想管语义,因为工具类的封装就是要屏蔽掉语义的差异和不方便,做到以人为本。很多人批判 JQ 一个选择器干太多事,但是如果 jq 把$换成 jqDOM 、 jqString 、 jqSelector ,那么还会有多少人用一个框架。

兼容性就不提了, jq2 完美兼容 jq1 ,只是舍弃了一些浏览器。值得产品经理学习的是, jq 专注解决程序员遇到的 dom 操作问题,顺便附送了几乎完美的 ajax 封装和一些工具类,该有的都有了,而且几乎没有任何多余的功能。所以,在移动端没发力之前,很多前端都是 jq+模板搞定一切。所以说,想把 jq 批判一番,搞个大新闻?

接下来,让我们说一下 react ,我最近也跳了这个坑,没办法, ng2 和 vue 在我需要的一个第三方核心组件上表现的太差,甚至 vue 的这个组件 demo 都无法打开, star 也被几十倍的碾压。但是这不代表 react 没有问题,有很多人说 react 牛就牛在 jsx 上,是的,我最近在写, jsx 的却很灵活,内嵌函数的写法可以让你做到几乎无所不能。但是,我想反过来问你,你这辈子用过的模板,无论 js 、 java 、 python ,谁家的模板不支持 if 和 for ,这个时候有人跳出来教育我 jsx 不是模板,模板的定义太简单了,一个字符串,支持${}这样的变量替换,这就是模板, jsx 完全满足这个条件。当然,群众的需求总有人满足, npm 上有大量的 if 和 for 实现可以用。

另外一点我想说的是 redux 或者 flux ,这种设计,为了弥补 react 本身单向传递数据的不足(你说是 feature 我也没办法),我认为单向实际上也是一种倒车,因为无论以前 ng1 ,现在 ng2 ,国产 vue 还有支持 ie6 的 avalon 都是双绑支持,偏偏到了 react 这里就是单向绑定。我第一眼看到 redux ,这不就是一个状态机么,再想想,回想起本科学过的编译原理和形式语言与自动机这些课程,是的,状态机不简单,尤其是把一个大系统的状态清晰的梳理起来,不是一件容易的事,对团队要求很高,因此我在项目选型时,果断拒绝了 redux 使用了以前大家熟悉的事件模型。

这里顺便有一个我遇到的问题,一个选项卡组件,要求很简单(1)实现基本的选项卡功能,即点击选项卡高亮标签并切换对应选项卡(2)标签的样式和 html 由用户自行输入,不限制是什么,只要高亮标签的 bg-color 就够了。(3)选项卡标签和内容不一定在 dom 上有相邻或者嵌套关系,这点可选,这个需求用 jq 甚至源生应该是手写级别吧,那么大家试试 reactive 的开发需要多少代码呢?

接下来说说混合开发,这个东西,明显看出是专门为了企业开发而设计,当然对于那种创业多久就倒闭或者拿到钱转 native 的就不说了。企业开发,实现就可以了,不要求多炫酷的界面和流畅性,内网对网速不敏感,内部应用没人闲的去看你代码或者找你漏洞,这完美的避开的混合开发的弱点。没办法, js 的特性,无论混淆成什么样都裸的跟不穿底裤一样,这绝对比不上 lua 这种除了传统混淆还可以魔改解析器的脚本语言。那么,现在的微信小应用,除了传统 H5 的问题之外,你的入口、用户,整条命都落在别人手里,你甘心么?也许,这样可以净化一下现在的 app 乱象,留下用户真正需要的功能,也就是大公司、大企业的那些“公益”应用,比如查快递、挂号、查化验单,这些无人竞争,抄了都没用的东西,才是完美试用小应用的东西。

最近出了 rn ,又出了阿里的 weex ,这个跟 cordova (前段时间搞cordova的项目升级,真的跟名字一样,写作cordova读做坑多挖)系的框架不一样, cordova 上层无论什么,底层都有大量的 native 插件够你适配源生功能,用 rn 的还好毕竟上了 react 的船的太多了,有人解决 native 层的问题,然而对于新的 native 框架,你确认自己搞的定么。

前端人喜欢造轮子,前几天找一个 url param 拼接的框架,安装完发其他应用居然也依赖了 2 个 url param ,长的还不一样。仔细一翻,还有大量的 isEmail , isURL 这样的依赖,数一数一个项目刚开始做就 600 多个 node modules (当然包括了 dev 依存),如果放到 java 里,这简直是不可思议,因为 apache utils 一套就提供了不知道多少的功能。既然提到了 apache ,我要说一下 java ,很多人说前端风云大变,后端跟死水一样,那我到想问问,这几年无论 taobao 也好,还是 12306 ,都是前端优化的结果,后端只要放那自生自灭就能解决大并发问题了?

如果是一个 java 项目选型, spring 作为底层一定全票通过,接下来可能是 mybatis 和 hibernate 对决,这个根据项目特点也是几乎唯一的选择,这些定了后面就没什么可争论的了。但是前端选型,我估计 react 、 vue 、 ng 就能打一天。因此, java 这种十年不变的风格,沉淀了不知道多少的精髓,除了虚拟机的调优外,还有大量的跑车,这可不是轮子,包括演化了多少代的 lucene (现在都用 elasticsearch 了),还有一系列 hadoop 、 spark 这些数据挖掘框架,其余的什么工作流、数据总线都不好意思说了。但是现在前端跳出来了,他们要用 js 横扫一切,我想问一下那么多 java 、 php 、 python 、 c++、 erlang 、 golang 工程师会坐以待毙么?

不变应万变是个好事, js 当初草草开场,现在又飞速进化到 ecma2015 ,但是底层运行的还是丑陋的 ecma3 (我不拒绝上帝的要求,上帝给我钱我就做 IE8 兼容),相比之下多少人在用 java1.6 , python2.7 ,我相信,语言、语法糖本身绝对不是首选,因为如果大家真喜欢语法糖,那么你们应该拥护 c#才对,唯一的解释就是搞 js 的人没事自己闲的革自己的命。习惯是个好事,如果稳定,又能满足要求的话,你看的电视多少年都是方形的,自行车多少年都是两个圆轮子的,现在 js 世界是个什么样,有一个很牛逼的自行车,炫酷跑的又快,唯一的问题是,没有握把,握把需要你自己实现。。

刚需和自己乱革命是两回事,什么是真正解决刚需的,一个是 jq ,一个我认为是大规模推开 mvvm 的 ng1 ,可惜这两个都被你们鄙视了,然后 google 草草开出了 ng2 的车,又发现自己在前端内置一个超牛逼的 complier 反倒加重了系统负担,直到前几天正式发布才有了 aot 。然后又是react这种把html混写到js里。另一方面,我们看架构工具,glup和grunt已经是历史,webpack去年兴起今年就有人要革他的命,明年又是什么打包工具呢?grunt没有错,他的设计就是批处理,压缩、混淆、整合都能做到,webpack也是bundle更方便加热调试,那么新的架构工具又有什么feature能让用户放弃之前的东西,重新再造一次海量的轮子呢?

这样的乱象何时能了?不知道。
29940 次点击
所在节点    前端开发
173 条回复
ssehacker
2016-10-18 13:23:34 +08:00
3. 楼主几乎没有做过移动前端。
sodatea
2016-10-18 13:24:33 +08:00
ng2 是单向绑定([(ngModel)] 只是语法糖而已)
vue2 也是单向绑定

能不能搞清楚点再长篇大论……
franckcl
2016-10-18 13:25:34 +08:00
不是针对楼主啊,我就说我知道的, python 现在真是 2.7 应用的范围更大也更多,很多开源的应用或者库还不支持 python3 , python3.4 跟 3.5 都有不少的改变,当然这只是 python 的历史原因, JS 我觉得就是因为当时推出时的设计太仓促
sodatea
2016-10-18 13:26:05 +08:00
擦,笔误,我想说的是单向数据流,双向绑定只是语法糖
sodatea
2016-10-18 13:38:31 +08:00
关于 fetch 你也完全说错了。
fetch 完全不是开倒车,因为它的精髓不是他的 API 设计(但不管怎么说它的 API 完全由于 XMLHttpRequest ,,只是说还不够优秀而已)。
fetch 的意义在于它是比 XMLHttpRequest 更底层的 API , Service Worker , SRI 之类的新 Web 标准里的很多功能都依赖于底层 fetch 的实现。只看到表层的 API 设计就狂喷也太不专业了。
MorlayNull
2016-10-18 13:39:33 +08:00
SPA 和 Page 是两种东西
话说回来, SPA 的 SEO 很难做
an168bang521
2016-10-18 13:40:32 +08:00
每当前端争议的时候,

我就发我的 Javascript 学习笔记,都是 Javascript 的总结知识,前端入门的同学欢迎 star ,欢迎修正;
https://github.com/Broszhu/zhuanbang-javascript-notes

然后发现很多人对基础都很重视;很多事情没有必要挣的脸红脖子粗的,看应用场景的;
以前喜欢看新的类库和框架,现在保持中立态度;(目前看好 jquery 、 gulp 、 webpack 、 react )
sodatea
2016-10-18 13:45:40 +08:00
BTW , NG2 的 AOT 支持是很早就有的,不是等到要发布了才匆匆加上的。
sodatea
2016-10-18 13:46:54 +08:00
另外,说 jQuery 过时的,很多都是前端自嘲而已,不要随随便便就当真啊……

以及,说其他框架没解决刚需的,只是没解决你的刚需而已。
emric
2016-10-18 13:55:27 +08:00
现在的 JavaScript 像 PHP ,有人说我不要框架写的很好( vanilla ),有人说我只要 ORM 就行( jQuery ),框架什么都是浪费性能,把简单的事情变复杂。

总之你开心就好。
gouflv
2016-10-18 13:57:14 +08:00
纯属瞎操心, 看别人不是都用得好好的嘛?
chemzqm
2016-10-18 14:06:56 +08:00
倒车不至于吧,主要是现代大型项目对于体验要求和迭代要求越来越高,进而产生了各种工具和框架解决相应问题,一个架构的考量是多个维度的,如果你想要稳定性就必然会牺牲灵活性,例如 react 相对于 jquery ,前者看似复杂,实际上对于多变的业务更为友好,而后者尽管开放方便但是代码往往混乱不堪。
前端框架思想现在基本上也是大同小异,例如 react , vue2 和 MINA 都是基于 VirtualDom 的组件化方式,以及数据流的单向流动,这里我不得不吐槽下 angular1 的双向绑定,用的时候问题层出不穷,基本就是面向巧合编程。
webpack 这种工具看着配置很多,但是实际使用大部分功能你并用不上,基本配置出来就可以了,并不是很费时(除非你需要研究它底层实现)。它比之前 grunt , seajs , requriejs 之类工具提供的功能更多更好(打包配置, loader 配置,插件配置等等),使用也更加灵活,替代它们是必然的。
mbfan
2016-10-18 14:12:10 +08:00
方便说下是什么组件吗?
最近开始啃 vue ,想造轮子→_→
DualWield
2016-10-18 14:21:55 +08:00
你光看到了很多新的框架,工具的产生,不去想一想新的框架、工具的优点、精髓,就来找喷吗?

这是一个前端百花争鸣百花齐放的时代。
anuxs
2016-10-18 14:27:47 +08:00
看出来楼主是原创,科班出身,有丰富的项目经验,支持你的观点。 js 社区已经魔障了。
murmur
2016-10-18 14:28:55 +08:00
@jin5354 已感谢,的却企业开发用 ng1 非常爽,很多开发就算不是 sap ,处理复杂表单做成多页也对得起 ng1 了
@leer561 好久不上语文课了,感谢纠正
@ssehacker 我们的大项目都是 iframe 的应用,没办法,小公司不可能有那么多精通 ng 的工程师,所以干脆 iframe 算了
@ssehacker 我们的移动端起步比较早,那个时候好像 ionic1 连 beta 都没出吧,用的 backbone ,吃够苦头了
@sodatea 参见文档 Form Input Bindings ,"You can use the v-model directive to create two-way data bindings on form input and textarea elements. "
@sodatea 我找到的比较新的文章还是 2016 年 4 月左右的,所以求更多资料, aot 很爽,换掉默认编译器之后那 binding 小的感人
@chemzqm 某些我认为合理的功能被去掉了,嗯就这样,留着不好么
@mbfan card layout , react 上的 star 3000 了快, vue 和 ng2 的好像还都才几十,最早应该都是 gridster
newljs
2016-10-18 14:29:46 +08:00
楼主开心就好。
imdoge
2016-10-18 14:40:16 +08:00
xerxes
2016-10-18 14:52:33 +08:00
@zongwan md5 和 base64, npm 里很多
leer561
2016-10-18 14:52:48 +08:00
首先我觉得是前端从事件驱动转为数据驱动的改变。
其次这不是乱,而是大家说的百花齐放百家争鸣,我们有很多很好的选择,选择适合自己的业务场景的就好了啊。
不断前进,不断造轮子,不断踩坑,挺好的嘛,没有开倒车。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/313482

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX