前端简史

2,058 阅读9分钟

前端发展史及趋势

世界第一台计算机

  • 时间/地点/人物:1946年2月14日世界第一台计算机“ENIAC”(埃尼阿克)在美国宾夕法尼亚大学诞生。电脑的发明是一群科研人员共同努力的成果,但其中数学家冯·诺依曼的设计思想在其中起到了关键作用,所以冯·诺依曼被称为现代计算机之父。
  • 背景:二战中,美国国防部用它进行弹道计算。
  • 相关属性:它是一个庞然大物,用了18000个电子管,占地170平方米,重达30吨,耗电功率约150千瓦,每秒钟可进行5000次运算。
  • 意义:它的问世标志着电脑时代的开始。

编程语言与操作系统

  • UNIX(尤尼斯)
    • 时间/地点/人物:1969年诞生于美国AT&T(美国电话电报公司)的贝尔实验室,开发者是:Ken Thompson(肯·汤普森)、D.M.Ritchie(丹尼斯·里奇)、Douglas McIlroy(道格拉斯·麦克罗伊)。
    • 背景:20世纪60年代,贝尔实验室的研究员Ken Thompson(肯·汤普森),闲来无事,手痒难耐,想玩一个他自己编的,模拟在太阳系航行的电子游戏——Space Travel。背着老板找了台空机器开始开发,但是这台机器没有操作系统,而游戏必须使用操作系统的一些功能,于是他着手开发操作系统,后来这个操作系统被命名为--UNIX。
    • 特性:多用户,多任务的分时操作系统,具有良好的安全性,保密性和可维护性。
  • Linux(里那克斯)
    • 时间/地点/人物:1991年10月5日,芬兰赫尔辛基大学的研究生林纳斯·托瓦兹宣布Linux内核诞生。年仅21岁。
    • 背景:林纳斯经常要用他的终端仿真器(Terminal Emulator)去访问大学主机上的新闻组和邮件,为了方便读写和下载文件,他自己编写了磁盘驱动程序和文件系统,这些在后来成为了Linux第一个内核的雏形。
    • 有些人生来就具有统率百万人的领袖风范;另一些人则是为写出颠覆世界的软件而生。唯一一个能同时做到这两者的人,就是托瓦兹。”美国《时代》周刊对“Linux之父”林纳斯·托瓦兹(Linus Torvalds)给出了极高的评价。甚至,在《时代》周刊根据读者投票评选出的二十世纪100位最重要人物中,林纳斯居然排到了第15位,而从20世纪的最后几年就开始霸占全球首富称号的盖茨不过才是第17位。
    • 特性:免费使用、自由传播、多用户、多任务、支持多种平台。
  • windows
    • 简介:1985年美国微软公司开发的一套操系统,简单易用,个人电脑喜爱的操作系统。采用了图形化模式GUI。
  • Mac OS
    • 简介:1984年开发,它是基于Unix内核的图形化操作系统,也是首个在商用领域成功的图形用户界面操作系统,很少受到病毒的袭击,最新的系统版本是macOS 10.14。
  • FORTRAN
    • 简介 :1954年约翰·巴克斯,世界第一个高级语言,源自于“公式翻译”(英语:FormulaTranslation)的缩写。
  • C语言
    • 时间/地点/人物:1972年美国AT&T贝尔实验室的D.M.Ritchie(丹尼斯·里奇),在B语言的基础上设计出了C语言,取BCPL的第二个字母作为语言名字。
    • 背景:20世纪60年代,贝尔实验室的研究员Ken Thompson(肯·汤普森),闲来无事,手痒难耐,想玩一个他自己编的,模拟在太阳系航行的电子游戏——Space Travel。背着老板找了台空机器开始开发,但是这台机器没有操作系统,而游戏必须使用操作系统的一些功能,于是他着手开发操作系统,后来这个操作系统被命名为--unix。
      1970年肯·汤普森以BCPL语言为基础,设计出了接近硬件的B语言,并用B语言写了第一个unix系统。
      1971年,同样酷爱Space Travel的丹尼斯·里奇为了能早点儿玩上游戏,加入了Thompson的开发项目,合作开发UNIX。他的主要工作是改造B语言,使其更成熟。
      1972年,丹尼斯·里奇设计出了C语言,人称C语言之父,UNIX之父。
      1973年,C语言的主体完成。丹尼斯·里奇和肯·汤普森迫不及待地开始用它完全重写了UNIX。
    • 相关属性:高级语言、结构式语言、代码级别的跨平台、使用指针
  • C++/Java
    • 简介:C++1983年由C语言改良而来,Java1996年由sun公司开发,主要开发者詹姆斯·高斯林,2009被甲骨文公司收购。

前端起源

  • www/web:World Wide Web,即万维网、广域网

    • 时间/地点/人物:1989年CERN(欧洲粒子物理研究所)的英国计算机科学家蒂姆·伯纳斯·李发明了万维网并申请了知识产权。
    • 背景:当时蒂姆·伯纳斯·李为了方便科学家们之间看文档、传论文,创造了万维网,他被称为万维网之父。伯纳斯·李也是“千年技术奖”这一全球最大的技术类奖的首位获得者。还是图灵奖的获得者。
    • 意义:它使得全世界的人们以史无前例的巨大规模相互交流,是人类历史上最深远、最广泛的传播媒介。改变了世界,成就了一批富翁如:amazon的创办人杰夫·比佐斯,Yahoo的创始人杨致远,Netscape的创始人马克·安德森……
  • w3c:万维网联盟,又称W3C理事会

    • 时间/地点/人物:1994年10月在麻省理工学院计算机科学实验室成立,建立者是万维网的发明者蒂姆·伯纳斯·李。
    • 背景:为了完成麻省理工学院(MIT)与欧洲粒子物理研究所(CERN)之间的协同工作,致力于实现所有的用户都能够对 web 加以利用(不论其文化教育背景、能力、财力以及其身体残疾)。
    • 所做事情:制定web标准规范,200多项标准。

时间轴线

  • 1994年前端历史的起点,这一年蒂姆·伯纳斯·李创建w3c、网景推出了第一版Navigator、css发布、服务端脚本php诞生。
  • 1995年网景推出了JavaScript,实现了客户端的计算任务(如表单验证),发明者是Brendan Eich(布兰登·艾奇)。
  • 1996年微软推出了iframe标签,实现了异步的局部加载。
  • 1997年 由Netscape、Sun、微软、Borland ECMA-262(欧洲计算机制造商协会)
  • 1999年W3C发布第四代HTML标准,同年微软推出用于异步数据传输的ActiveX,随即各大浏览器厂商模仿实现了XMLHttpRequest。这标识着Ajax的诞生,但是Ajax这个词是在六年后问世的,特别是在谷歌使用Ajax技术打造了Gmail和谷歌地图之后,Ajax获得了巨大的关注。Ajax是Web网页迈向Web应用的关键技术,它标识着Web2.0时代的到来。
  • 2006年,XMLHttpRequest被W3C正式纳入标准。同一年John Resig发布了jQuery,主要用于操作DOM,中心思想是取其元素,对其操作。随即成千上万的插件诞生。
  • 2008年谷歌V8引擎诞生,改变了浏览器性能低制约前端的开发的局面,现代浏览器的崛起标志着前端计算能力有弱变强。
  • 2009年第五代JavaScript发布,同一年AngularJS诞生,随后被谷歌收购,前端走进了一个令人目不暇接的新时代。
  • 2009年Ryan Dahl发布了node,node是一个基于V8引擎的服务端JavaScript运行环境,类似于一个虚拟机,也就是说js在服务端语言中有了一席之地。如果说ajax是前端的第一次飞跃,那么node可算作前端的第二次飞跃。它意味着JavaScript走出了浏览器的藩篱,迈出了全端化的第一步。
  • 2010年backbone.js诞生
  • 2011年React和Ember诞生
  • 2014年Vue.js诞生,同一年,第五代HTML标准发布。
  • 2015年ECMAScript6发布,简称ES6。
  • 至此前后端分离已经是大势所趋,数据驱动框架也形成了三国鼎立的局势,Angular、React、Vue各占一席。

从前后端不分离到分离

  • 前端是对浏览器的开发,代码在浏览器运行。后端是针对服务器的开发,代码在服务器运行。
  • 互联网发展的早期,前后端开发是一体的,前端代码是后端代码的一部分。
  • 当时后端是MVC的开发模式,前端只是后端MVC中的V。那时的前端工程师,实际上是模板工程师,负责编写页面模板。
  • Ajax 技术诞生,改变了一切。2004年:Gmail,2005年:Google 地图。前端不再是后端的模板,可以独立得到各种数据。Ajax 技术促成了 Web 2.0 的诞生。
  • 前端通过 Ajax 得到数据,因此也有了处理数据的需求。这导致前端MVC框架的诞生。代表之一是Backbone,但是Backbone 没有 C,只用事件来处理 UI 逻辑。
  • 另一些框架提出 MVVM 模式,用 View Model 代替 Controller。本质:view 绑定 view-model,视图与数据模型强耦合。数据的变化实时反映在 view 上,不需要手动处理。
  • 传统结构是后端把渲染好的html给浏览器,SPA架构是,后端把数据给js,js渲染html给浏览器。
  • 前后端分离:Ajax使前端应用兴起,智能手机的普及使前端要支持多终端。前端不再是后端 MVC 中的 V,而是单独的一层。
  • 未来只有端工程师(手机端、PC 端、TV 端、VR 端......)和云工程师。

参考链接1 参考链接2