美文网首页
大前端的三层思考-2019-12-21

大前端的三层思考-2019-12-21

作者: 勇往直前888 | 来源:发表于2019-12-21 11:20 被阅读0次

    是否选择大前端?

    虽然现在大前端很热门,是不是适合自己呢?这个需要想一想

    技术的广度和深度,哪个优先?

    可以简单类比一下,一个人或者一家公司的技术能力是有限的,可以用一个矩形表示。矩形的宽代表技术的广度,矩形的高代表技术的深度。

    1. 大前端是偏向广度优先的,如果在矩形面积一定的情况下,如果宽度变长了,那么技术高度就会变短,产品就会显得粗糙,这是现实的条件限制。
    2. 如果更看重技术的深度,比如垂直细分领域,那么就不适合用大前端的思路来做。放弃大前端,比如,只做iOS原生版本,那么就可以将技术做得深入一点,产品也会显得更精致。
    3. 如果能力强,也就是矩形的面积够大,那么可以两方面都做得很好。比如大公司,就是这么干的。其实市面上这些大前端的技术框架,基本上也是大公司搞出来的。比如,Hybrid是微软的;React是Facebook的,Flutter是谷歌的。

    技术驱动还是业务驱动?

    大前端的优势是效率高,多端一致性好,带来的好处是响应业务的速度快。同样,带来的问题是技术深度不足,产品相对粗糙。比如,大前端思路下的产品,可以合理地推断,产品体验是iOS下降为和Android一致,而不是Android的体验上升为和iOS一致。

    • 如果是业务驱动型,那么采用大前端是很好的选择。iOS和Android的双端一致是天然的,iOS的体验稍微下降一点,普通用户也感觉不出来。
    • 如果是技术驱动型,那么大前端并不是一个很好的选择。iOS这种强调体验的产品更能体现出技术的深度和先进性。

    第一层,组织上的大前端

    • 传统的组织方式很简单:iOS一个团队,前端一个团队,Android一个团队,后端一个团队。
    • 传统的组织方式侧重于专业化,就是俗话说的一个萝卜一个坑。
    • 传统的组织方式的弊端就是部门墙和沟通协调成本高。
    • 大前端团队:交互、UI、iOS、Android、前端、后端组成一个团队;
    • 大前端团队主要解决的问题就是部门墙,降低沟通成本;
    • 大前端团队的主要职责是快速实现业务,多端同时推进;
    • 大公司,可以业务导向,根据业务,多建几个大前端团队就可以了。
    • 大前端团队的第1管理者是产品经理,推进业务,提供产品需求文档。
    • 大前端团队的第2管理者是技术背景的大前端架构师,负责需求文档的实现和推进。
    • 大前端团队的管理模式:敏捷管理,产品经理当Product Owner,大前端架构师当Scrum Master

    第二层,架构上的大前端

    大前端的目标是加大前端技术的比重吗?恰恰相反,大前端的发展方向是“一云多端”,是将业务尽可能多的往后端迁移。前端主要负责界面展示,交互信息采集等内容。

    后台切换

    为了测试和试用,后台需要部署在不同的服务器上。前端,需要保存好几个后台域名地址,并且提供切换方式。常用的方式,比如,连续点击图标或者标题什么的多次,在弹出框中输入密码,进入一个调试页面,进行环境切换。
    这种方式运行很好,真正的普通用户能够发现这个调试页面的很少,对测试人员也很方便。
    但是这种方式真的好吗?更好的方法,是将环境切换这部分工作迁移到后端,专门提供一层,来完成这个工作。这一层职责单一一点,一旦上线,基本不用改变。各种前端设备,只要连接这个固定后端就可以了,切换工作,在这个切换层来实现就可以了。

    BFF

    BFF(Backend for Frontends,为前端而存在的后端)
    后端技术一旦确定,一般是稳定的,比如现在比较多的就是Java。

    • 减少重复:这一层,用的是后端的技术,比如Java,但是,做得业务,却是前端的。那些不涉及界面的,不涉及交互的前端逻辑,一般都可以放在这里做。比如,后端提供的是一个数字的时间戳,但是界面上显示的是年-月-日格式的字符串,那么这种转换工作,在这里做就是合适的。这样做的好处是显而易见的,这里做一层转换,iOS,Android,网页,甚至小程序上,只要直接展示就可以了,能够减少很多重复的工作,提高团队整体效率。
    • Demo数据:需求文档出来了,可是后端服务没有好,没有数据,怎么办?傻等,显然是不合适的。没数据,先造几个假数据。一般都是前端开发自己造的,只要界面显示正确就好了。实际上也都是这么干的,能落地,但是实际效果却并不好,开发体验也是很差的。更好的做法是在这个BFF做,并且提供一个简单界面,让测试人员来提供demo数据。将一条条的Excel测试案例,转化为实实在在的demo数据,更接地气。

    网关层

    这一层应该成为前后端的界面层。各种后台服务,可以做成各种openAPI,由网关层统一管理。BFF层来统一接入,非常合适。对网关层来说,BFF只是一个内部客户而已,最多给一些特殊权限,很好管理。
    现在由各种前端直接连网关层是非常不合适的,用起来的感觉实在太差。有些恶心的,在手机端都要维护一个自己的数据库,那要后台干什么呢?

    第三层,技术上的大前端

    大前端的技术一直在发展,从WebView到ReactNative再到现在的Flutter。目前的Flutter,可以做为一种大前端的技术选择来用。

    • 强调双端一致,让iOS的体验降低为和Android一致;
    • Flutter一直在发展,只使用一些已经被验证为成熟的技术;
    • 界面采用谷歌推荐的风格,组件使用成熟的框架,icon采用谷歌提供的标准icon。专注于业务,而不是专注于交互体验。
    • 兼容性交给Flutter框架,而不是自己整。如果这个麻烦不能扔出去,那么还用框架干什么呢?
    • 一次编码,多端运行,从一开始就要坚持。采用纯Dart编码,不要采用混合模式。多用pub上的第三方库,少写原生组件。
    • 当然,Dart层的自定义封装应该是要鼓励的。

    相关文章

      网友评论

          本文标题:大前端的三层思考-2019-12-21

          本文链接:https://www.haomeiwen.com/subject/erwwnctx.html