新媒易动态
NEWS CENTER
NEWS CENTER
2020-04-05
前端工程师的技术栈:
HTML和CSS是标记类语言,这两类是Domain Specific Language,领域特定语言。
JavaScript与前两者性质不同,其本质是一门编程语言。
这三门语言,相互耦合,并非独立。CSS必须与HTML配合,JavaScript逻辑需借助HTML和CSS直观地展示给用户。
前端工程师是直接面向用户的,良好的用户体验是一个Web产品的基本要素。此处我们讨论的用户体验并非交互方案或视觉设计,这些事是UI、UE的工作。我们讨论的是以下几点:
其实也就是性能。
我们分点解释上述三点。
为何性能至关重要?
性能在任何在线业务的成功方面都扮演重要角色。 以下是一些案例研究,显示了性能出色的网站与性能较差的网站相比,如何更好地与用户互动并留住用户:
以下是两个案例研究,显示了低性能会对业务目标产生不利影响:
我们说Node.js是扩展技能,不是说Node.js本身,而是指以Node.js为代表的Web服务器端知识。
综上,以下是前端工程师的职责能力范畴
原始的前后端耦合的串行开发流程已经不能满足Web产品快速的迭代需求,Web开发者开始尝试在开发、测试和部署等各个环节寻求更高效的协作方式。所以,有了前后端分离。
前后端分离指的是通过将前端工程师与后端工程师进行明确、合理的分工,改善前后端协作中拖慢开发进度的环节,提高拱卒效率。前后端分离的核心是解耦。从开发、测试以及部署这3个角度开,前后端分离对工作效率的提升如下:
我们分别来看看,原始的前后端耦合的串行开发,已经前后端分离后的开发模式。
原始的开发模式,前端开发主要工作是将UI设计稿试用HTML和CSS进行还原,对于JavaScript的开发顶多是实现一些动画效果,业务逻辑基本不涉及。然后,前端工程师将开发完成的demo交付给后端工程师,后端工程师做的第一件工作就是将demo代码中的HTML和CSS套入服务器模版引擎中,俗称“套模版”,然后在此基础上编写客户端的JavaScript业务逻辑。
但是这种协同工作模式的开发效率是非常低下的。后端的工作,只有等待前端完成了之后才可以开展。
合理的分工是前后端分离的第一步,也是后续各种优化方案的基础。团队人员按智能分为前端工程师和后端工程师。对于前端工程师来说,后端工程师的唯一产出就是数据,包括用于服务器渲染HTML模版的初始数据和客户端请求返回的数据。
明确了各自的分工后,我们分别从开发、测试和部署3个方面分析前后端分离要解决哪些问题。
2.2.1 开发
开发阶段前后端分离要解决的问题可以按照资源类型分为两种:静态资源的处理和动态资源的处理。
静态资源指的JavaScript、CSS、图片等,这类资源在浏览器的呈现方式是静态的,不需要服务器做任何处理。动态资源指的是HTML模版。
静态资源的处理相对简单,因为这类文件不依赖任何服务器环境,只需要在浏览器里解析即可。