(二) 从Angular1到Angular2需要的预备知识
1. TypeScript语法与ES6新特性
写惯了jQ的话突然从ES5跳到ES6,又是个变形的ES6(TypeScript),学习成本确实不低。不过笔者也是从ng1直接上手ng2,对与很多新特性的积累基本是抄着ng2官网的快速起步捡起来的。所以给的建议是,有ES6甚至TS基础肯定完美,但是在使用ng2过程中现学这些也完全没有问题。
2. Webpack前端模块化
ng2的默认模块化工具是SystemJS,也是个很酷炫的模块化工具。但它也只是个模块化工具,只管帮你模块化代码不管打包压缩,这会导致项目运行过程中会不停的去请求module啊component啊service啊甚至component的模板html啊css啊全都得请求,还是未压缩的。所以SystemJS下的ng2拿来娱乐玩玩还不错,真要做产品还是得换Webpack上场(相比SystemJS的配置只需要一个.config.js而且是动态加载,Webpack则需要手动编译打包然后运行,其打包配置也是一门学问)。
Webpack给我的感觉就是,理解起来有一定难度,但好在一劳永逸,一旦完成了成熟的配置,后续所有项目都通用。
3. 前后端分离的SPA架构
这个不仅是ng2了,Web趋势如此,服务器只做WebApi,客户端算是个独立的应用。
前后端分离要面对一些问题,比如跨域,比如网络请求的认证,客户端登录状态的保持等等。
带来的好处之一是客户端非常容易扩展,部署一个WebApi服务一百个客户端网站理论上完全没问题,还有就是客户端迁移到跨平台App上或是原生App的Webview中会相对简单很多,可以直接把前端网站想象成真正的Android App来开发。
4. ng1的一些架构思维
ng2相比ng1是强化了它好的地方,并修改了它不好的地方,抛开项目迁移的门槛与工作量,ng2一定是远强大与ng1的。其部分核心理念还是继承下来的,比如其组件、服务、管道的概念。其中组件是ng1中标签型指令的分离强化版,服务依然是那个通过依赖注入到具体组件的强大单例工具,管道则是ng1过滤器的演变形态,去掉了几个性能杀手级别的自带过滤器,还有更强大的动画系统与路由体系等等。
5.npm基础
ng2在npm上维护,绝对是个好消息,至少保证了其生命力,不再是在页面上引用个*.min.js完事了(虽然强行这么做也还是可以),不过这又要求开发者有一些npm使用的基础了,简单的包管理指令就足够。当然如果想要进一步自己开发一个ng2模块并发布到npm,还是需要一些功底才能做到了,这涉及到npm的一些发布流程以及js模块化的包管理概念。
总结是要想使用ng2来完成一个产品,还真得学习不少新技术,门槛不低,但要是连这么多东西都能熟练运用,不是一件相当有征服感与成就感的事么!
(二) 从Angular1到Angular2需要的预备知识的更多相关文章
- Angular1还是Angular2
Angular1还是Angular2 学完angular1,尝试去看了下angular2,虽然号称更强更快,可是这基于ES6和TypeScript的全新框架让人完全招架不住,而且我只是需要angula ...
- word2vec 中的数学原理详解(二)预备知识
版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/peghoty/article/details/37969635 https://blog.csdn. ...
- word2vec 中的数学原理具体解释(二)预备知识
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/peghoty/article/details/37969635 word2vec 是 Googl ...
- LeetCode刷题预备知识(二)
Python四大数据结构的属性及方法 在LeetCode刷题预备知识一中我们掌握了常见的内置函数,和四大数据结构的基本概念: 但只掌握这些还远远不够,我们还需了解四大数据结构的属性及方法才能更高效快速 ...
- LayIM.AspNetCore Middleware 开发日记(二)预备知识介绍
前言 开发一个AspNetCore的中间件需要理解RequestDelegate.另外,还需要理解.NET Core中的依赖注入.还有一个就是内嵌资源的访问.例如:EmbeddedFileProvid ...
- 从0开发3D引擎(二):准备预备知识
大家好,本文介绍了开发3D引擎需要的预备知识,给出了相关的资源. 上一篇博文 从0开发3D引擎(一):开篇 了解Web 3D Web 3D的历史 目前Web 3D是基于WebGL这个Web端3D AP ...
- 受限玻尔兹曼机(RBM)学习笔记(一)预备知识
去年 6 月份写的博文<Yusuke Sugomori 的 C 语言 Deep Learning 程序解读>是囫囵吞枣地读完一个关于 DBN 算法的开源代码后的笔记,当时对其中涉及的算法原 ...
- LDA-线性判别分析(一)预备知识
本来是要调研 Latent Dirichlet Allocation 的那个 LDA 的, 没想到查到很多关于 Linear Discriminant Analysis 这个 LDA 的资料.初步看了 ...
- IP地址和子网划分学习笔记之《预备知识:进制计数》
一.序:IP地址和子网划分学习笔记开篇 只要记住你的名字,不管你在世界的哪个地方,我一定会去见你.——新海诚 电影<你的名字> 在我们的日常生活中,每个人的名字对应一个唯一的身(敏)份(感 ...
随机推荐
- Oracle行转列的3种方法
测试表为A3 , 有5个字段:ID1, ID2, ID3, ID4, ID5 测试数据如下: ID1 ID2 ID3 ID4 ID5 1 2 3 4 5 11 22 33 44 55 111 222 ...
- HttpListener 实现web服务端
1. using System; using System.Collections.Generic; using System.Linq; using System.Text; using Syste ...
- 4.ICMP协议,ping和Traceroute
1.IMCP协议介绍 前面讲到了,IP协议并不是一个可靠的协议,它不保证数据被送达,那么,自然的,保证数据送达的工作应该由其他的模块来完成.其中一个重要的模块就是ICMP(网络控制报文)协议. 当传送 ...
- box-sizing
Over the generations, people realized that math is not fun, so a new CSS property called box-sizing ...
- Angular - - $resource 更高端的数据交互
$resource 创建一个resource对象的工厂函数,可以让你安全的和RESFUL服务端进行数据交互. 需要注入 ngResource 模块.angular-resource[.min].js ...
- js原生设计模式——2面向对象编程之继承—call(this)构造函数式继承
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- Linux释放内存脚本
vi recover_mem.sh #!/bin/bash ################## #author:rrhelei@126.com# ################## #系统分配的 ...
- 用NetStream的appendBytes播放FLV
public class MiniStream extends Sprite { private var _buffer:ByteArray = new ByteArray(); private va ...
- jQuery 在Table中选择input之类的东西注意事项
jQuery 在Table中选择input之类的东西注意事项: 如果不在td标签中,是不能进行正确选择的: <table id="tblFormId"> <tr& ...
- JSP编译为Java类
JSP编译为Java类: 注意可以随便写import的内容:可以写类属性.方法.main函数.内部类:可以使用内部类: JSP: <%@ page language="java&quo ...