月度归档： 2020年3月

造梦师——《机器之心》读后感

西部世界是一部美剧，最近开始播放第三季了，主要讲由一座巨型高科技以西部世界为主题的成人乐园，提供给游客杀戮与性欲的满足，随着接待员有了自主意识和思维，他们开始怀疑这个世界的本质，进而觉醒并反抗人类的故事。

继续阅读“造梦师——《机器之心》读后感”

Angular框架发展史

前端三大框架vue，angular，react，今天来聊聊Angular发展史。

0.背景

前端开发的基础仍然是HTML+CSS+Javascript。原始的Javascript（以下简称JS）写法是程序员撰写的JS代码和发布版JS基本相同，最多用混淆工具对单个文件做一些混淆处理。这个阶段的JS开发模式是手工+工具。

Jquery的出现让JS在前段开发中重要性大大提高，html和css的所有动态调整都可以由JS完成。但是由于Jquery只是对Javascript的框架封装，开发者的开发模式依然是手工+工具。

Node.js是对JS开发方式的一种重要改进。程序员基于Node.js编译器开发JS代码，开发后的文件由Node.js转换成发布版JS。发布过程中的优化、整合、混淆等等，完全有Node.js编译器完成。至此JS开发进入集成开发环境阶段。

Angular、React、Vue以及很多最新的前端开发框架（包括微信小程序）都是基于Node.js，因此它们都具有Node.js提供的特性。它们也被前端开发工程师形象称为“脚手架”

Angular开发的一个主要特点在于使用Typescript作为开发语言，源码文件以.ts结尾。Typescript是一种Javascript超集，最终也依赖Node.js编译器转化成发布的js文件。个人觉得使用Typescript的一个潜在好处是开发者可以明显的区分开发用的ts和发布的js文件。

1.AngularJS vs Angular

AngularJS指的是早期的Angular版本，就是从2009年诞生的那个版本，那个时候AngularJS版本更新很慢，直到2016年，AngularJS的版本才是1.7*，而在这之后，AngularJS不在继续老版本的更新了，而是推出了一个全新的版本Angular 2，这个版本因为从底层彻底重构了，所以它和之前的AngularJS可以说不是一个框架了，因此，现在人们讨论的Angular一般意义上是指Angular v2及以上版本。它是一种前端应用框架，使用TypeScript语言。第一个版本实际使用Javascript，因此被称为AngularJS。

具体时间线如下：

  • AngularJS 作为最早的版本，AngularJS于2009年开始开发，于2010年发布初始版本。由于Angular 和 AngularJS开发语言不通，Angular JS仍在维护，1.7.5 版本于2018年10月发布。
  • Angualr 2 于2014年十月宣布，于2016年五月推出第一个发布版。该版本不再受JS的作用域、控制器等特性要求，而是使用组件等更适应开发阶段的特性。
  • Angular 4 由于路由包已经占用了版本编号V3.3.0，为了避免混淆，Angular直接从 V2 跳到 V4。第一个发布版于 2017年3月发布，并完全向下兼容 Angular 2。
  • Angular 5 于2017年11月发布。新特性包括支持渐进式网站应用（PWA），并对Material设计框架等有更好的支持。
  • Angular 6 于2018年 5月发布。该版本主要改进了工具链，使其对开发者更加友好。
  • Angular 7 于2018年 10月发布。 该版本同步依赖 Typescript 3.1， RxJS 6.3 和 Node10（兼容 Node8）。
  • Angular 8 于2019年 5月发布。该版本改进了应用程序在现代浏览器上的启动时间，提供了开发 CLI 的新的 API，保持了 Angular 与业界生态和更多新的 Web 标准的同步。
  • Angular 9 于2020年 2月发布。该版本默认情况下将应用程序切换到Ivy编译器和运行时，并引入了改进的组件测试方法。
  • Angular 10 将于2020年6月发布。
  • 具体参考： https://github.com/angular/angular/blob/master/CHANGELOG.md

2.高速发展

Anguar 10马上要发布了，要知道之前用了8年才发布了一个主版本，而现在4年时间已经发布了8个版本。这是因为现在Angular采用了语义本版本控制，每个6个月就会升级一个大版本。

3.三大特性

angular能够高速发展是因为它有三驾马车全力牵引着它。

TypeScript

现在的ts已经成为了各个开发框架的首选的语言。vue3.0也是使用的TypeScript。TypeScript是JS的超集，提供了比js更多的语法特性，具有面向对象的全部特性，非常适合开发大型项目。而Angular就采用了typescript来进行框架的构建，这样使得它的开发迭代变得异常迅猛。

rxjs

它是使用Observables进行响应式编程库，表示我们可以订阅异步数据流。该库提供了内置的运算符，用于观察，转换和过滤流，甚至将多个流组合在一起以一次创建更强大的数据流。Angular将所有信息作为从路由参数到HTTP响应的可观察流处理。

Zone.js

js是异步执行的，当代码很多的时候，如果想要统计执行时间将变得非常困难，而zone.js解决了这些问题，zone.js能实现异步Task跟踪，分析，错误记录、开发调试跟踪等，通过它的钩子，我们只要将函数执行挂在到它的上面，我们就能统计分析函数执行效率。

4.依赖注入，控制反转

软件开发强调低耦合，而依赖注入就是将被依赖的对象(service)实例传递给依赖对象(client)的行为。将被依赖的对象传给依赖者，而不需要依赖者自己去创建或查找所需对象是依赖注入的基本原则。正是这样的设计思想，让angular的各个功能都通过依赖注入，使得代码耦合大大降低。

5.Ivy

它是angular提供的下一代编译和渲染引擎，通过使用Ivy，我们AOT编译速度将得到大幅度提升。代码将变得更加简洁，代码将会得到大幅压缩，而这也是Angular 9默认开启的，当然，如果你不想使用这个引擎的话，也可以进行关闭。

VUE框架发展史

1.基本介绍

“简单却不失优雅，小巧而不乏大匠”。很多使用过vue的程序员这样评价它，“vue.js兼具angular.js和react.js的优点，并剔除了它们的缺点”。授予了这么高的评价的vue.js，也是开源世界华人的骄傲，因为它的作者是位中国人–尤雨溪（Evan You）。

Vue.js 是一个JavaScript MVVM库，是一套构建用户界面的渐进式框架。它是以数据驱动和组件化的思想构建的，采用自底向上增量开发的设计。相比于Angular.js，Vue.js提供了更加简洁、更易于理解的API，使得我们能够快速地上手并使用Vue.js；同时比起 React + Redux 相对复杂的架构，Vue.js 更加轻量级也更加容易上手，是初创项目的首选前端框架。Vue 的核心库只关注视图层，它不仅易于上手，还便于与第三方库或既有项目整合。并且作者是华人的关系，Vue拥有着对华人开发者最友好的api文档和官方教程。

时至今日，Vue已成为全世界三大前端框架之一，Github 上拥有近 17 万 Star 领先于 React 和 Angular，在国内更是首选。它的设计思想、编码技巧也被众多的框架借鉴、模仿。

2.重要版本发布

  • 2013年，在 Google 工作的尤雨溪，受到 Angular 的启发，开发出了一款轻量框架，最初命名为 Seed 。
  • 2013.12，更名为 Vue，图标颜色是代表勃勃生机的绿色，版本号是 0.6.0。
  • 2014.01.24，Vue 正式对外发布，版本号是 0.8.0。
  • 2014.02.25，0.9.0 发布，有了自己的代号：Animatrix，此后，重要的版本都会有自己的代号。
  • 2015.06.13，0.12.0，代号Dragon Ball，Laravel 社区（一款流行的 PHP 框架的社区）首次使用 Vue，Vue 在 JS 社区也打响了知名度。
  • 2015.10.26，1.0.0 Evangelion 是 Vue 历史上的第一个里程碑。同年，vue-router、vuex、vue-cli 相继发布，标志着 Vue从一个视图层库发展为一个渐进式框架。
  • 2016.10.01，2.0.0 是第二个重要的里程碑，它吸收了 React 的虚拟 Dom 方案，还支持服务端渲染。自从Vue 2.0 发布之后，Vue 就成了前端领域的热门话题。
  • 2019.02.05，Vue 发布了 2.6.0 ，这是一个承前启后的版本，在它之后，将推出 3.0.0。
  • 2019.12.05，在万众期待中，尤雨溪公布了 Vue 3 源代码，目前 Vue 3 的进展情况可以通过这个链接查看：https://github.com/vuejs/vue/projects/6 。

3.Vue 1.0

Vue最初的目标是成为大型项目的一个良好补充。

设计思想是一种“渐进式框架”，淡化框架本身的主张，降低框架作为工具的复杂度，从而降低对使用者的要求。

主要改进

  1. 提供指令的缩写。针对v-bind和v-on提供缩写形式：
  2. 清理精简所提供的接口
  3. 提高初始化的渲染效率
    将v-repeat指令换成了v-for指令。同时优化了这个指令的渲染，效率提升了一倍
  4. 两个官方工具的增强：vue-loader和vueify
  <!-- v-bind -->
  <div v-bind:class="box">全写</div>
  <div :class="box">缩写</div>
  <!-- v-on -->
  <button v-on:click="btn">全写</button>
  <button @click="btn">缩写</button>

4.Vue 2.0

2.0版本对Vue做了大幅度的重构，性能有了很大的提高，也为日后的跨端发展打下了基础。

性能提升
2.0 用一个 fork 自 snabbdom 的轻量 Virtual DOM 实现对渲染层进行了重写。在其上层，Vue 的模板编译器能够在编译时做一些智能的优化处理，例如分析并提炼出静态子树以避免界面重绘时不必要的比对。新的渲染层带来了巨大的性能提升，也让 Vue 2.0 成为了最快速的框架之一。

服务端渲染
Vue 2.0 支持服务端渲染 (SSR)，并且是流式的，可以做组件级的缓存，这使得极速渲染成为可能。

5.Vue 3.0

3.0 是非常大的重构，源码使用 TypeScript 重写，目前的代码 98% 以上使用 TypeScript 编写。目前 Vue 3 的进展情况可以通过这个链接查看：https://github.com/vuejs/vue/projects/6 。