在软件开发领域,前端工程师曾经是一个比较纠结的职业。在Web技术真正发展起来之前的相当长一段时间里,由于技术门槛很低,前端工程师行业一直是鱼龙混杂的状态。其中很多号称是Web开发者的人实际上并没有什么专业的前端技能,有些工作就是被当做简单的力气活由美术设计师顺便做做而已。当时很多人甚至并不认为有朝一日会有这么一群人用HTML、CSS和JavaScript这三门技术谋生——他们想,这怎么可能呢——这些技术看起来都是如此简单,随随便便混在一起用就哦了,把做这些活看成一种正儿八经的职业简直是笑话。

随着技术发展,人们对前端工作的看法开始改变了,一些人从美工页面仔真正转变为专业的前端工程师。JavaScript,这门很多工程师曾经把它当做玩具而不屑一顾的脚本语言悄然演变成推动互联网发展的核心驱动力。伴随着越来越多的浏览器的出现使得用HTML和CSS兼容各种浏览器变得越来越难,于是能实现兼容各种浏览器的页面成为了前端工程师的金字招牌,前端职业开始变得炙手可热。

  • 两个独立的UI层

即使Ajax这种技术风靡全球之后,前端工程师的主要工作曾经也仅局限于浏览器窗口之内。HTML、CSS和JavaScript是前端工程师必须要掌握的三种核心技术,前端同后端的唯一交集仅仅是前端需要确保后端的数据能够以正确合适的格式输出到浏览器上。在某种意义上来说,Web开发有两个UI层,一个是在浏览器里面我们最终看到的,另一个在server端,负责生成和拼接页面。因为传统前端基本上没有办法自主决定server端如何处理数据拼接生成页面,因为数据如何组织,往往是会受到后端工程师所选择的技术框架的影响的,而后端不理解前端的一些需求,所以他们选择的时候也就很少会从前端方便的角度进行考虑。

在上面这张图的结构里,浏览器里的UI层是完全归前端工程师管的。服务器端的UI层则是前后端都关心的部分,剩下的部分是服务端的底层,诸如数据处理、缓存、权限控制和其他核心模块,这些是归后端管的。我们还是回过头来看我们所关心的server端UI层吧,这一层所做的事情通常是拼页面模板以及处理具体的业务交互逻辑。

所以,传统的前后端分工是由前端负责浏览器,而其他浏览器之外的东东统统归由后端负责。前后端的交集server的UI层也是由后端来主导的。这是目前最主流的一种前后端分工方式。

  • 让Node.js来改变这一切

Node.js一发布,立刻在前端工程师中引起了轩然大波,前端工程师们几乎立刻对这一项技术表露出了相当大的热情和期待。上一次一种技术能被整个前端界如此关注那还是在几年之前,那时候Ajax这个概念刚刚被提出来。让JavaScript跑在server端,这个想法简直太棒了。这下我们不用再去学那些什么PHP啦、Ruby啦、Java啦、Scala啦或者其他什么对前端来说奇怪的语言,也可以轻松地将我们的领域扩展到server端,多么美好的前景!

我从来不是一个PHP的爱好者,但是我在Yahoo工作的时候,我不得不使用PHP。为了这份工作,我得忍受花费许多额外的时间去修复由于PHP的傻逼特性导致的坑。对于一直使用Java作为服务端语言的我来说,对PHP实在是很难适应。我相信,也一直坚持认为一种静态类型的语言更加适合用来构建你的业务逻辑的核心部分。因此,虽然我很喜欢JavaScript,但我也不会用它来做所有的事情,比如我绝对不会只用JavaScript来实现一个完整的购物车系统。

对于我来说,Node.js不是一个解决一切问题的银弹,我不会用它来取代server端所有别的语言模块。事实上,Node.js可以做到其他后端语言所能做到的几乎所有的事情,但是我不会这么做。我所认为的比较合适的做法是用Node.js来解决server端UI层的问题,这样我就可以将这一层从后端的其他部分剥离出来。

现在越来越多的公司倾向于采用面向服务(service-oriented)的架构,由后端提供给前端RESTful的接口,这么做是为了更好的做前后端的依赖分离。如果所有的关键业务逻辑都封装成REST调用,就意味着在上层只需要考虑如何用这些REST接口构建具体的应用。那些后端程序员们根本不操心具体数据是如何从一个页面传递到另一个页面的,他们也不用管用户数据更新是通过Ajax异步获取的还是通过刷新页面,当然他们更不关心的是你究竟在用jQuery还是YUI——这与他们根本毫无关系嘛。后端程序员真正应该关心的难道不应该是数据如何存储、如何容错以及如何保证安全性吗?

现在我们看看Node.js带来的好处吧,当后端程序员提供了REST服务之后,现在我们前端程序员可以使用Node.js来处理server端的UI层啦,我们可以将通过REST调用拿到的数据随心所欲地进行处理,不管是渲染模板还是直接提供给Ajax,现在我们仅仅用JavaScript一种语言就可以轻松实现这些。至于后端程序员,他们只需要保证数据的正确性,无论他们使用任何一种语言来封装REST调用,都不会对前端造成影响,这样前后端的职责不就被更好地划分了吗?这样分工之后前端的领域就从浏览器小框框里面扩展到了server的UI层,而这一层本来对于后端来说是一件他们做起来不轻松的零碎活儿。

  • 不!这太耸人听闻了!

前端工程师想接手server的UI层是不那么容易被后端工程师们理解和接受的,因为这部分工作本来属于后端工程师的职责。尤其是现在还有很多后端工程师认为JavaScript是一种极简单的“玩具语言”,他们将会想如此重要的服务端工作怎么能交给这群看起来不太靠谱的人用如此“不严肃”的语言来玩?在我的经验里,这种观念上的冲突是前后端工程师们在是否引入Node.js这一问题上的最大分歧。Server端UI层是前后端的中间地带,而之前通常后端程序员们对这个地带比较有主导权,所以一旦你进入这个本来属于后端主导的领域,争议自然是不可避免的。

实际上放弃传统的角色立场,将server的UI层分给前端,在大型Web架构下是很有意义的。不这么做的话,有时候前端想要从后端要到正确的数据,还不得不关心后端究竟是用什么语言实现的。过去的分工中,那些原本属于核心业务底层考虑的东西会被暴露给server的UI层,而这些问题往往会不小心影响到前端。前端本来不需要关注这些问题,因为前后端所关心的方面根本完全不一样嘛。如果你理解单一职能、责任分离和模块化,你就会理解我所说的,甚至会觉得以前不把server的UI层分给前端实在是很笨。

只可惜,之前Node.js这样的东东不存在,所以当时没有前端合适的技术让前端工程师们自己搞定server的UI层。于是后端的同学们用PHP的人就顺手把UI用PHP的模板实现了,同样的用Java的后端同学也自然而然地用JSP搞定这个问题。这不是前端的同学不愿意去做Server的UI,而是因为在之前,没有一种我们熟悉的技术让我们能够搞定这些事情,但是现在不一样了,我们有Node.js了。

  • 结论

我很喜欢Node.js,我喜欢由这项技术给前端界带来的更大的发展潜力。我并不认为整个后端完全用Node.js来实现会是一个很好的方案,尽管Node.js完全可以做到这一切。我认为目前Node.js最大的价值是能让前端完全把控整个UI层,不论是浏览器的还是Server端的,做到这一点,我们工作的效率能得到很大的提升。我们前端更擅长于决定数据以何种方式呈现能带给用户更好的体验,而后端则更加了解如何处理数据。在这种新的分工方式下,后端只需要提供合适的数据操作接口,前端自己就能构建漂亮的、有效率的、可用性高的接口,从而实现用户所喜欢的各种交互。

使用Node.js来搞定server的UI层也将后端工程师从他们不擅长的领域解放了出来。于是我们得到了一个Web开发的灵丹妙药:前后端之间只需要通过数据来交互,这种模型使得两方相互独立,各自都能够快速迭代开发,而只要保证数据接口不变,前后端彼此之间就不会造成任何影响。

果断尝试一下吧,这个方案也许正适合你的团队。

Node.js 给前端带来了什么的更多相关文章

  1. node.js和前端js有什么区别

    进行前端开发工作需要掌握技能有html. css.js以及各种前端框架,把这些技术玩6就可以成为一名合格的前端开发工作者 而进行nodejs开发,需要掌握js.web服务器原理.关系数据使用, 如果玩 ...

  2. 一个基于React整套技术栈+Node.js的前端页面制作工具

    pagemaker是一个前端页面制作工具,方便产品,运营和视觉的同学迅速开发简单的前端页面,从而可以解放前端同学的工作量.此项目创意来自网易乐得内部项目nfop中的pagemaker项目.原来项目的前 ...

  3. 一统江湖的大前端(2)—— Mock.js + Node.js 如何与后端潇洒分手

    <一统江湖的大前端>系列是自己的前端学习笔记,旨在介绍javascript在非网页开发领域的应用案例和发现各类好玩的js库,不定期更新.如果你对前端的理解还是写写页面绑绑事件,那你真的是有 ...

  4. light,node.js,webStorm 安装项目搭建

    light,是一个移动应用开发平台,旨在降低H5.APP的开发门槛.运维成本.提升移动应用产品的持续交付能力. 用light可以做什么 快速组织移动H5应用的协作开发.调试.应用发布,发布的应用可直接 ...

  5. 为什么 2020 还要学 Node.js

    更佳阅读体验 https://www.yuque.com/sunluyong/node 前言 前些日子刷知乎看到个 2019 年初的问题 2019年nodejs凉了吗?凉到什么程度了?才看到问题的时候 ...

  6. 为什么要使用 Node.js

    这是一个移动端工程师涉足前端和后端开发的学习笔记,如有错误或理解不到位的地方,万望指正. Node.js 是什么 传统意义上的 JavaScript 运行在浏览器上,这是因为浏览器内核实际上分为两个部 ...

  7. Node.js 开发指南笔记

    第一章:node简介 介绍了node是什么:node.js是一个让javascript运行在服务器端的开发平台, node能做些什么:[书上的] 具有复杂逻辑的网站 基于社交网络的大规模Web应用 W ...

  8. 使用 Node.js 搭建一个 API 网关

    原文地址:Building an API Gateway using Node.js 外部客户端访问微服务架构中的服务时,服务端会对认证和传输有一些常见的要求.API 网关提供共享层来处理服务协议之间 ...

  9. java结合node.js非对称加密,实现密文登录传参——让前后端分离的项目更安全

    前言   在参考互联网大厂的登录.订单.提现这类对安全性操作要求较高的场景操作时发现,传输的都是密文.而为了目前项目安全,我自己负责的项目也需要这方面的技术.由于,我当前的项目是使用了前后端分离技术, ...

随机推荐

  1. tomcat开发远程调试端口以及利用eclipse进行远程调试

    一.tomcat开发远程调试端口 方法1 WIN系统 在catalina.bat里:  SET CATALINA_OPTS=-server -Xdebug -Xnoagent -Djava.compi ...

  2. .net erp(办公oa)开发平台架构概要说明之表单设计器

    背景:搭建一个适合公司erp业务的开发平台.   架构概要图: 表单设计开发部署示例图    表单设计开发部署示例说明1)每个开发人员可以自己部署表单设计至本地一份(当然也可以共用一套开发环境,但是如 ...

  3. CSS三个定位——常规、浮动、绝对定位

    .dage { width: 868px; background: #5B8C75; border: 10px solid #A08C5A; margin-top: -125px; margin-le ...

  4. 用Kotlin实现Android定制视图(KAD 06)

    作者:Antonio Leiva 时间:Dec 27, 2016 原文链接:https://antonioleiva.com/custom-views-android-kotlin/ 在我们阅读有关c ...

  5. 和我一起看API(一)你所不知道的LinearLayout补充

    楼主英语水平差,翻译的不好的话请多多指正,嘿嘿... A Layout that arranges its children in a single column or a single row. T ...

  6. Form 表单提交参数

    今天因为要额外提交参数数组性的参数给form传到后台而苦恼了半天,结果发现,只需要在form表单对应的字段html空间中定义name = 后台参数名 的属性就ok了. 后台本来是只有模型参数的,但是后 ...

  7. 【教程】SQLite数据库修复

    SQLite 大家都知道,就不多说了. 有时候数据量大了,或者存储过程中出现异常,数据库就可能会出问题. 这是以前公司产品出现过的问题,导致软件都打不开了,我花了不少时间才解决的,趁现在有空贡献出来. ...

  8. SpringMVC(关于HandlerMapping执行流程原理分析)

    请求过来先碰见中央调度器(前端调度器) //Determine handler for the current request; 对当前请求决定交给哪个handler, 当前请求地址过来 处理器执行链 ...

  9. js动态加载css和js

    之前写了一个工具类点此链接里面含有这段代码,感觉用处挺多,特意提出来 var loadUtil = { /* * 方法说明:[动态加载js文件css文件] * 使用方法:loadUtil.loadjs ...

  10. 一种简单的CQRS架构设计及其实现

    一.为什么要实践领域驱动? 近一年时间我一直在思考一个问题:"如何设计一个松耦合.高伸缩性.易于维护的架构?".之所以有这样的想法是因为我接触的不少项目都是以数据库脚本来实现业务逻 ...