重学前端
程劭非(winter)
前手机淘宝前端负责人
立即订阅
32867 人已学习
课程目录
已完结 58 讲
0/4登录后,你可以任选4讲全文学习。
开篇词+学习路线+架构图 (3讲)
开篇词 | 从今天起,重新理解前端
免费
明确你的前端学习路线与方法
列一份前端知识架构图
模块一:JavaScript (15讲)
JavaScript类型:关于类型,有哪些你不知道的细节?
JavaScript对象:面向对象还是基于对象?
JavaScript对象:我们真的需要模拟类吗?
JavaScript对象:你知道全部的对象分类吗?
JavaScript执行(一):Promise里的代码为什么比setTimeout先执行?
JavaScript执行(二):闭包和执行上下文到底是怎么回事?
JavaScript执行(三):你知道现在有多少种函数吗?
JavaScript执行(四):try里面放return,finally还会执行吗?
JavaScript词法:为什么12.toString会报错?
(小实验)理解编译原理:一个四则运算的解释器
JavaScript语法(预备篇):到底要不要写分号呢?
JavaScript语法(一):在script标签写export为什么会抛错?
JavaScript语法(二):你知道哪些JavaScript语句?
JavaScript语法(三):什么是表达式语句?
JavaScript语法(四):新加入的**运算符,哪里有些不一样呢?
模块二:HTML和CSS (16讲)
HTML语义:div和span不是够用了吗?
HTML语义:如何运用语义类标签来呈现Wiki网页?
CSS语法:除了属性和选择器,你还需要知道这些带@的规则
HTML元信息类标签:你知道head里一共能写哪几种标签吗?
CSS 选择器:如何选中svg里的a元素?
CSS选择器:伪元素是怎么回事儿?
HTML链接:除了a标签,还有哪些标签叫链接?
CSS排版:从毕升开始,我们就开始用正常流了
HTML替换型元素:为什么link一个CSS要用href,而引入js要用src呢?
HTML小实验:用代码分析HTML标准
CSS Flex排版:为什么垂直居中这么难?
CSS动画与交互:为什么动画要用贝塞尔曲线这么奇怪的东西?
HTML语言:DTD到底是什么?
CSS渲染:CSS是如何绘制颜色的?
CSS小实验:动手做,用代码挖掘CSS属性
HTML·ARIA:可访问性是只给盲人用的特性么?
模块三:浏览器实现原理与API (9讲)
浏览器:一个浏览器是如何工作的?(阶段一)
浏览器:一个浏览器是如何工作的?(阶段二)
浏览器:一个浏览器是如何工作的(阶段三)
浏览器:一个浏览器是如何工作的?(阶段四)
浏览器:一个浏览器是如何工作的?(阶段五)
浏览器DOM:你知道HTML的节点有哪几种吗?
浏览器CSSOM:如何获取一个元素的准确位置
浏览器事件:为什么会有捕获过程和冒泡过程?
浏览器API(小实验):动手整理全部API
模块四:前端综合应用 (5讲)
性能:前端的性能到底对业务数据有多大的影响?
工具链:什么样的工具链才能提升团队效率?
持续集成:几十个前端一起工作,如何保证工作质量?
搭建系统:大量的低价值需求应该如何应对?
前端架构:前端架构有哪些核心问题?
特别加餐 (9讲)
新年彩蛋 | 2019,有哪些前端技术值得关注?
用户故事 | 那些你与“重学前端”的不解之缘
期中答疑 | name(){}与name: function() {},两种写法有什么区别吗?
答疑加餐 | 学了这么多前端的“小众”知识,到底对我有什么帮助?
加餐 | 前端与图形学
加餐 | 前端交互基础设施的建设
期末答疑(一):前端代码单元测试怎么做?
期末答疑(二):前端架构中,每个逻辑页面如何可以做到独立发布呢?
加餐 | 一个前端工程师到底需要掌握哪些技能?
尾声 (1讲)
尾声 | 长风破浪会有时,直挂云帆济沧海
重学前端
登录|注册

前端架构:前端架构有哪些核心问题?

winter 2019-05-18
你好,我是 winter,今天我们来谈谈架构。
在传统桌面软件开发中,架构师是一种通过设计架构保证团队能够良好分工和有序工作的岗位。
在工程领域,我们凡是要做点什么事儿,都会有明确的目的性,这个目的性,一定是为了完成生产服务业务的。
为什么桌面软件开发需要架构师和架构设计呢?因为桌面软件开发具有高度的复杂性,如果没有架构,就没法分解成互相耦合低的模块来分工。
所以一般来说,架构是为了分工而存在的。但是到了前端领域,这个问题是否还存在呢?答案是,不存在。
前端是个天然按照页面解耦的技术,在多页面架构中,页面的复杂度大约刚好适合一个人的工作量。(所以,我们的结论是,前端根本不需要架构设计。当然,我这句话是开玩笑的。)
前端不存在分工问题,但是在多人协同时,仍然要解决质量和效率的问题,这就需要组件化了。除此之外还有前端特有的兼容性问题,也是需要从架构的角度去解决的。
对于一些追求极致的团队来说,会挑战“单页面应用”,通过单页面应用来提升用户体验,单页面应用的升级版本是谷歌提出的 PWA,PWA 既是业务方案也是技术方案,在技术层面,它近乎苛刻地规定了网页的各方面的体验标准。
前端领域还有一个特有的生态:框架,第一代前端框架(如 jQuery, PrototypeJS)重点解决了兼容问题和 API 的易用性问题,在现代浏览器普及之后,这些问题逐渐变得不存在或者不重要,所以第二代前端框架(如 Vue,Angular,React)重点解决了组件化问题。选择合适的框架,可以节约架构的成本,还能够享受社区资源。
取消
完成
0/1000字
划线
笔记
复制
© 版权归极客邦科技所有,未经许可不得传播售卖。 页面已增加防盗追踪,如有侵权极客邦将依法追究其法律责任。
该试读文章来自付费专栏《重学前端》,如需阅读全部文章,
请订阅文章所属专栏。
立即订阅
登录 后留言

精选留言(16)

  • 阿成
    我头铁,直接上新技术(react+hooks),因此遇到不少坑,不过是个小项目且只有我在做啦😂😂😂

    怎么说,我觉得有时候还是要大胆一些... 当然多人协作的项目就不要搞人家了...
    2019-05-18
    13
  • Neil 陈荣
    我觉得在 spa 成为普遍现象的今天,前端架构特别重要。
    然后大多数的小团队单是跟进前端技术的发展就已经很费力了,这时候如果是一个前端技术工具方面玩的溜一点的,却缺少架构思维的人在早期来主导项目的代码结构的话,往往会成为整个项目的灾难。
    在团队缺少架构高手的情况下,还是做多页应用来得更可控些,需要体验优化的页面就是自己做成一个简单一些的 spa.
    这是我从之前两个项目中学到的教训。
    2019-05-18
    8
  • 行云
    我很无耻的说一下,感觉spa更简单,反而传统的多页面开发模式,更麻烦
    2019-05-22
    6
  • 老实人
    请问每个逻辑页面如何可以做到独立发布呢?
    2019-05-21
    3
  • Neil 陈荣
    关于组件化,我很不喜欢 react 中的 Functional Component 以及 HOC.
    对于整个产品需求非常稳定情况来说,这样做也许没问题。把 UI表现和功能,按照不同的 perspective 去拆开,即所谓 separation by concern 的思路。
    但对于一般的项目而言,往往需求变化都是比较频繁的,我认为更好的组件化方式是按功能切分。因为这样的组件内聚性比较好,会更便于代码阅读以及快速开发迭代。
    在 React 上有些人比较推崇的那种纯 ui 表现类的组件,然后通过 HOC 来组装,实在是太绕了,完全不对我的胃口。
    2019-05-18
    2
  • cjd
    没有架构 项目用什么自己定 经常会很纠结用什么技术😂 有些想尝试的新技术 由于能力有限加项目通常都很赶 不敢实践到项目中 不加班的时候 会自己写些demo 折腾折腾
    2019-05-18
    2
  • 靠人品去赢
    你好老师,现在管理的一个后台系统是JSP+Java合在一块的东西。想弄个功能类似上传视频,找到很多插件都是很久没有维护的,就在想要不要把这个前端JSP展示的部分提出来作为一个前端,后台只是作为一个core响应请求。如果是你的话,你会怎么做?
    想问一下,想阿里的后台管理是怎么搞的,是不是前后端分离的,因为我知道阿里也是Java大户,像这种后台管理怎么做的?

    作者回复: 在现代服务端架构中,视频都是需要CDN支持的,所以很难通过“插件”来解决,这跟你的服务端架构强相关,如果是我的话就直接扔给云存储,后面用服务端逻辑解决。

    2019-07-08
    1
  • 小孔
    如果项目只有我自己写的话 我会用新技术、自己不熟悉的领域去练习, 自己思考组价架构,设计模式等。。如果是多人协作 我可能就随大流了。。不敢瞎搞
    2019-05-28
    1
  • sugar
    spa好像不止hash一种实现方式,抛弃老版本浏览器的话,似乎可以利用history api,结合服务端url path接力,实现可前进后退的spa吧?我见过这样的 不知这种方式除了旧版本兼容性外 还有没有啥坑~

    作者回复: 你说的没错,但是history api配合URL就需要服务端做很多事情了,这个是个综合架构问题,目前我还没见过特别好的案例

    2019-10-10
  • sugar
    目前实现spa方面 是否有较为成熟的框架推荐

    作者回复: 这个我不太了解,目前社区方案我没有太满意的。

    2019-10-10
  • 令狐洋葱
    “实现单页应用的逻辑页面发布需要改造发布系统,在工程上,这也是一个比较大的挑战。” 老师,这句话是指单独发布部分逻辑页面么?
    2019-08-19
  • 究极体的拖延症患者
    在公司闲着无聊搭了一套 React 的架子想推广,结果被 CTO 直接拍死,说国内这么多学 Vue 的你给我搞什么 React...😂😂😂
    2019-07-23
    2
  • Cool
    一个人撸到尾,github就是我的架构
    2019-07-18
  • 柠檬树
    感觉我们没有前端架构,就是撸代码。实现功能就行。

    作者回复: 每个人都觉得是别人的事,但是总得有人第一个做。

    2019-07-15
  • metthew😀
    没有前段架构师,有部分人维护框架,但是架构升级或较大优化就没人了
    2019-06-10
  • Scorpio
    自己写代码,自己规划架构。。。
    2019-05-18
收起评论
16
返回
顶部