我们的团队对Angular 2的alpha版本感到非常兴奋,我们只是急切地等待它的稳定发布并开始使用它.但是在Misko的Angular 2的ng-conf 2015期间,我们遇到了令我困惑的以下事情
打字稿!是否真的需要使用typescript来获得更好的性能,而不是编写我们一直在做的简单的JS代码.我们发现了一些评论说明打字稿有助于提高性能.
ES6功能.由于角度2将使用很多es6功能,这意味着我们必须等待所有浏览器至少支持角度2所需的那些功能才能在我们的生产应用程序上启动它.
Web组件.由于角度2提供了创建Web组件的工具,而且我发现了一些关于创建自己的(使用聚合物)的博客,我们的团队创建它们有多难？或者,如果我们坚持旧的指令创造的事情,它会更好吗？
性能.我已经看过Angular + React的这个视频,它提供了角度与角度+反应与角度2的良好比较.但是我不确定角度2是否真的很快或者如果我们可以继续建立角度+反应应用程序,以避免等待角度2稳定或浏览器支持角度使用的es6功能.
我不确定我是否已经很好地构建了我的问题,但在我开始学习角度2之前,上面是我的担忧,因为他们演示角度2 +打字稿似乎会为我和我的团队带来很多收益曲线.
如果有人能澄清我上面列出的问题,我将非常感激.
谢谢.
1> bvaughn..：
打字稿!是否真的需要使用typescript来获得更好的性能,而不是编写我们一直在做的简单的JS代码.我们发现了一些评论说明打字稿有助于提高性能.
TypeScript是关于静态分析以获得更好的类型安全性.它还有一套非常好的编辑器工具(例如WebStorm).你不需要它来提高性能.它更像是一个帮助你创作的工具.就个人而言,我喜欢它.
我已经开始将一些现有的开源库迁移到TypeScript,因为它更容易使用.例如,请查看之前和之后的 Task Runner .
ES6功能.由于角度2将使用很多es6功能,这意味着我们必须等待所有浏览器至少支持角度2所需的那些功能才能在我们的生产应用程序上启动它.
许多ES6功能都可以进行polyfilled.查看https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills.
Web组件.由于角度2提供了创建Web组件的工具,而且我发现了一些关于创建自己的(使用聚合物)的博客,我们的团队创建它们有多难？或者,如果我们坚持旧的指令创造的事情,它会更好吗？
Web组件也是可填充的(参见此处).在这种情况下,我建议您遵循Angular团队推荐的创建组件的做法.也许还要关注聚合物团队在这方面的成果.
性能.我已经看过Angular + React的这个视频,它提供了角度与角度+反应与角度2的良好比较.但是我不确定角度2是否真的很快或者如果我们可以继续建立角度+反应应用程序,以避免等待角度2稳定或浏览器支持角度使用的es6功能.
这听起来像是过早的优化.首先构建(普通)Angular并仅在您发现应用程序的特定部分出现性能问题时进行优化.
我不可能说这两个.我不了解你的团队或你的项目.我可以告诉你的是,我(个人)喜欢使用TypeScript.我已将我现有的两个项目迁移到它(formFor和Task Runner),我将用它开始我的新项目.真是太好了.至于Angular 2 ......你是否应该使用它取决于几个因素:你当前的项目有多大？发布日期是什么时候？您定位的浏览器是什么？如果您的答案包括"非常大","很快"或"大多数浏览器",那么您现在应该坚持使用Angular 1.x
所以你认为我的团队需要多少努力(使用角度1.x和纯粹的es5)来吸收你上面提到的所有内容以及我们如何完全转移到打字稿+角度2？
2> Evan Plaice..：
打字稿!是否真的需要使用typescript来获得更好的性能,而不是编写我们一直在做的简单的JS代码.我们发现了一些评论说明打字稿有助于提高性能.
打字稿是不是需要使用Angular2.
您看到的大多数示例都将使用Javascript:
classes (ES6)
decorators (ES7 /打字稿)
types - (打字稿)
除此之外,浏览器还不支持这些功能,因此所有Angular2源都需要转换为ES5.
所以在ES5中:
classes 可以通过扩展原型伪造
decorators 可以使用包装函数伪造
types 开始时并不是必需的,为了安全起见,它们是为了增加合成糖
期望现有用户继承使用实验/前沿标准的风险是不现实的.因此,文档包括在ES5,ES6/7和Typescript中编写Angular2应用程序.
旁白:我个人不喜欢不使用TypeScript.Traceur可以被配置有用于@decorators实验扩展以支持,并system.js提供了所提出的一个填充工具ES6-moduler装载机规格.
以下是Angular2文档的介绍.
ES6功能.由于角度2将使用很多es6功能,这意味着我们必须等待所有浏览器至少支持角度2所需的那些功能才能在我们的生产应用程序上启动它.
正如我已经说过的,ES6在所有浏览器中都没有得到官方支持.即使是这样,大多数网站仍然需要使用polyfill来向旧浏览器提供向后兼容性.
其中一个很酷的功能es6-module-loader是能够动态地动态加载依赖项.当Angular2退出测试版时,应该很容易将其作为特征检测策略合并到您的应用程序中.
Web组件.由于角度2提供了创建Web组件的工具,而且我发现了一些关于创建自己的(使用聚合物)的博客,我们的团队创建它们有多难？或者,如果我们坚持旧的指令创造的事情,它会更好吗？
虽然您可能需要使用特定于Angular2的Web组件,但并不难.原因是,Angular2不仅仅是一个前端Web框架.它也可以用于同构(即后端的预呈现),本机和移动应用程序.这意味着,非常不鼓励直接触摸DOM.
至于组件本身的创建......它与在Angular2中创建任何其他组件没有什么不同.与按类型分组代码的旧MVC模型(即模型,视图,控制器)不同,组件模型鼓励按上下文对代码进行分组.
导入可重用组件时,它应该包含使用它所需的任何指令,服务等.
例如,请参阅 我建立.除了直接从GH克隆repo之外,还可以通过JSPM直接安装和导入代码.
简单import来说,将组件类添加到视图中directives,
性能.我已经看过Angular + React的这个视频,它提供了角度与角度+反应与角度2的良好比较.但是我不确定角度2是否真的很快或者如果我们可以继续建立角度+反应应用程序,以避免等待角度2稳定或浏览器支持角度使用的es6功能.
Angular2中引入了3项主要的性能改进.
1.双向数据绑定不再是默认值
需要数据绑定的元素需要在模板中明确标记(即不要烦恼,新语法使这非常简单).结果,对DOM进行脏检查所需的开销大大减少了.
这意味着,HTML标记中不再有$ scope,$ scope.apply()和奇怪的作用域规则.相反,自
2. Angular2利用虚拟DOM
jQuery使得直接操作DOM非常简单.因此,它还使没有经验的开发人员极易通过频繁的增量更新来破坏DOM并触发布局重排.
VDOM基本上是DOM的简化内存表示.增量更新直接应用于VDOM,稍后将批量应用于实际DOM.
除了网络请求,DOM操作是Javascript最大的性能弱点.另一方面,VDOM快一个数量级.而不是期望开发人员通过手动将更新添加到DOM来遵循"最佳实践",而Angular透明地处理批处理.
较少的DOM操作=较少的UI呈现/回流=更具响应性的用户体验.
3. Angular2在后台工作者上运行
这不完全是一个新概念.桌面GUI已经以这种方式工作了多年,从技术上来说,HTML5后台工作者的引入并不可行.
在大多数桌面应用程序中,主上下文同步运行+并且UI在其自己的单独线程中异步运行.无论应用程序在主上下文中执行什么操作,这都会使用户体验响应.
+注意:这不一定是真的,但为了清楚起见.
在浏览器中,所有执行都发生在主上下文+中.这意味着,每次Javascript必须阻止CPU操作时,用户界面就会对用户无响应.这并不理想,会造成糟糕/不一致的用户体验.
+注意:在实践中,浏览器的实现差异很大,但让事情变得简单.
对于Web worker,可以将除DOM +之外的所有内容都推送到后台工作者上下文中.理想情况下,Javascript应该对UI响应性几乎没有影响.
+注意:渲染器仍然需要访问DOM的状态.
这种转变的一个副作用是,Angular2架构现在完全与UI/DOM分离.这意味着,现在可以为其他平台(例如IOS,Android,SmartTV等)编写UI适配器,这些平台本身在相同的Angular2代码上运行.
应对
据我所知,React正在使用与Angular相同的性能改进.他们使用VDOM批量更新,并提到其他平台的本机可移植性,因此我假设他们经历了与Angular相同的架构更改.
老实说,使用后台处理来释放UI只是进一步实现桌面应用程序功能奇偶校验的又一步.
Angular2 vs React
我鼓励您一直观看视频直到最后.演示者在编写代码时搞砸了,所以现场演示不是一个诚实的比较.
话虽如此,哪个更快更重要.两者都不会比另一个快得多,但与其他UI框架相比,它们都会显着提高响应速度和可扩展性.
更新:
重写了有关Web组件的部分以更好地回答这个问题.
京公网安备 11010802041100号