日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 编程资源 > 编程问答 >内容正文

编程问答

最新Angular2案例rebirth开源

發布時間:2024/6/21 编程问答 34 豆豆
生活随笔 收集整理的這篇文章主要介紹了 最新Angular2案例rebirth开源 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

在過去的幾年時間里,Angular1.x顯然是非常成功的。但由于最初的架構設計和Web標準的快速發展,逐漸的顯現出它的滯后和不適應。這些問題包括性能瓶頸、滯后于極速發展的Web標準、移動化多平臺應用,學習難度等。

所以Angular團隊最終決定以全新方式構建Angular2框架。Angular2框架現在已經進入RC6版本,很快它就將進入最終發布版。Angular2帶來了很多不錯的特性,它們包括跨平臺、高性能、高效開發,擁抱web標準等等。

由于在Angular中引入了render層隔離設計,所以它也很容易實現跨平臺的拓展。多平臺拓展,理論上只需要實現目標平臺的render層處理邏輯。目前在Angular2的生態圈中已有的跨平臺框架如下:

  • Web:?Angular框架自身(https://angular.io/);

  • Universal / Isomorphic:?Universal(https://universal.angular.io/);

  • Progressive Web App:?mobile-toolkit(https://mobile.angular.io/);

  • NativeScript:?nativescript-angular(https://github.com/NativeScript/nativescript-angular);

  • React Native:?react-native-renderer(https://github.com/angular/react-native-renderer);

  • Ionic2:?Ionic2(http://ionic.io/2/);

  • Electron:?angular-electron(https://github.com/angular/angular-electron/);

  • …....

Angular2架構的重新設計,使得其在性能方面也得到了巨大的改善:

  • 組件樹和單向的@Input、@Output使得變更的影響變得可預知,不再需要Angular1那樣多次的digest直到穩定;以及結合ChangeDetectionStrategy.OnPush與immutablejs或者是Rxjs,Angular2的變更檢查算法復雜度降為了log(n)。相對于Angular1,得到了至少5倍的性能提升;

  • Universal服務端渲染能夠更好提升首屏加載的性能,以及單頁面應用的SEO問題;

  • AOT技術引入,能夠讓組件處理的生成代碼提前到構建時期;再加上TypeScript的tree shaking等技術,能夠更大化的減小加載JavaScript文件大小和提升運行時性能;

  • Web端Web Worker的實現,能夠更好的解放我們的UI線程,得到更好的而用戶體驗,以及性能的提升;

不僅僅這些,Angular2還有很多的優秀特性。如:基于TypeScript的靜態類型檢查、擁抱web標準(Shadow dom,fetch API)等等。

總之,Angular2是一門值得我們學習的優秀前端框架。隨著Angular2進入了RC6版本,意味正式發布版將不遠矣。開始學習Angular2的時機已經到了。

?

同時筆者也開源了自己的rebirth項目供大家學習。它是一個利用Angular2開發的博客系統前端部分。它涉及到的Angular2知識點非常的全面,包括:組件化,自定義directive,路由,HTTP交互,Template drive form和Reactive form,異步路由,jwt token認證,資源權限控制,動態加載component,jQuery插件集成等常用知識點。

同時rebirth項目也集成了很多前端優秀的技術實踐:

  • Angular2 + rxjs

  • bootstrap-sass

  • codemirror + markdownit(online markdown文檔編輯器)

  • webpack2 + DashboardPlugin(代碼打包)

  • TypeScript2 + @types

  • stubby(數據mock框架)

  • tslint + codelyzer(ts代碼和Angular2組件靜態檢查)

  • angular2-template-loader(Angular2 component的html、css打包)

  • karma + phantomjs(TDD開發)

  • sass + postcss(css樣式組織)

  • typedoc(ts文檔)

  • fontgen-loader(icon font)

  • .......

在這里為大家放上幾張rebirth效果圖,供大家預覽:

移動端樣式:

PC端樣式:

?

?

?

?

希望大家能喜歡。有任何的問題可以在筆者的github提issue,筆者會在空閑時間為大家解答。

?

rebirth 項目地址:?https://github.com/greengerong/rebirth

?

轉載于:https://www.cnblogs.com/whitewolf/p/5851196.html

總結

以上是生活随笔為你收集整理的最新Angular2案例rebirth开源的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。