由于本人应用项目主要是2B的web应用程序, 所以以下暂不谈react的服务端渲染和react navie,

先说说ReactJS:

  1. React 的组件化和  数据单向绑定 的模式(flux) 使应用程序更易于开发和维护。
  2. 相对于angular,Ember这种全面的框架,react 比较轻量级(非包大小),这样比较容易在其基础上架构应用或者配合其他功能库。
  3. 视图层的JSX无缝混合js代码,功能强大又不失可读性,可以说是集成了声明式编程和命令式编程的优点。
  4. 框架支持增量更新DOM的特性能有效保证程序的性能,通俗点说,就是不容易让一般水平的人写出性能糟糕的程序,这一点对于组织大型复杂的应用程序来说是很重要的。

再说说TypeScript

  1. 静态类型的编程语言更有利于工程化的一个原因是,更能被IDE充分的支持。宇宙最强IDE的VisualStudio 不只给TypeScript带来了很好的编程体验,近视于C#的方式实现了代码模块化 同时又能保留js动态语言灵活性,
  2. 一键生成解决了编译压缩的问题。
  3. TSX对于React的JSX也提供了很好的支持。

使用ReactJS 和 TypeScrit 一段时间,总结了自认为一些比较实用的Tip,跟各位分享,望能起到抛砖引玉的作用 ,高手不吝赐教 :

1.如何打包成单个js
  使用r.js  与VS 编译集成。当然在开发阶段这部分可以省略。
 
2. 组件化使用面向对象的方式,参考winform  和 webform
    面向对象的方式定义React组件(图)
    组件基类:
    
    已经写好的控件
    
3.使用消息机制来解耦
    组件之间的通信,尽量不要互相引用,通过消息机制来完成。
    Flux的思路也是如此,可以不需要直接使用flux库,如果掌握了flux的核心思路,用任何一个js事件消息库都可以。
    这边用的是EventEmitter2库
   
 
    
4.自己定义路由机制
   
   
5.使用后端编程的插件机制来解耦
    由于JS的动态语言特性,原生支持插件。所以只需要做一些少量封装,就可以实现简单实用的IOC插件功能。
    
控件注册:
    

当 ReactJS 遇到 TypeScript的更多相关文章

  1. Java技术体系总结

    PC前端:Javascript.JQuery.Angularjs.Reactjs.TypeScript 移动前端:Vue.js.Zepto WebJars spring:spring mvc.spri ...

  2. Nodejs + TypeScript

    Node.js https://nodejs.org https://nodejs.org/en/download/ win: msi mac: pkg linux: tar.xz source co ...

  3. TypeScript SDK 和 REST API

    在本文中,我们将讨论CUBA平台中已经存在很长时间的一个功能,但是很多人还不知道,这就是前端SDK生成器,并了解它如何与CUBA的REST API插件一起使用. Java+JavaScript - 在 ...

  4. 掌握Spring REST TypeScript生成器

    在优锐课的java分享中,讨论了关于Spring REST TypeScript生成器,该生成器创建反映后端模型和REST服务的模型和服务.码了很多干货,分享给大家参考学习. 我注意到网络开发人员创建 ...

  5. react: typescript project initialize

    Initialize the project create a folder project Now we’ll turn this folder into an npm package. npm i ...

  6. 开始使用 TypeScript 和 React

    原文地址:Getting started with TypeScript and React 原文作者:Jack_Franklin 译者:luxj 校对者:veizz Tom Dale 和其他人有一些 ...

  7. Sentry 开发者贡献指南 - 前端(ReactJS生态)

    内容整理自官方开发文档 系列 1 分钟快速使用 Docker 上手最新版 Sentry-CLI - 创建版本 快速使用 Docker 上手 Sentry-CLI - 30 秒上手 Source Map ...

  8. TypeScript: Angular 2 的秘密武器(译)

    本文整理自Dan Wahlin在ng-conf上的talk.原视频地址: https://www.youtube.com/watch?v=e3djIqAGqZo 开场白 开场白主要分为三部分: 感谢了 ...

  9. 一看就懂的ReactJs入门教程-精华版

    现在最热门的前端框架有AngularJS.React.Bootstrap等.自从接触了ReactJS,ReactJs的虚拟DOM(Virtual DOM)和组件化的开发深深的吸引了我,下面来跟我一起领 ...

随机推荐

  1. 团队作业4——第一次项目冲刺(Alpha版本)4th day

    一.Daily Scrum Meeting照片 二.燃尽图 三.项目进展 计时功能已经完成,然后24点的代码如何在游戏界面与界面组件联系上正在进行. 四.困难与问题 1.在安卓框架与java代码的结合 ...

  2. 201521123111《Java程序设计》第4周学习总结

    1. 本章学习总结 1.1 尝试使用思维导图总结有关继承的知识点. 1.2 使用常规方法总结其他上课内容. Answer: - 上课还讲了tostring的使用,般toString用于返回表示对象值的 ...

  3. 201521123042 《Java程序设计》第12周学习总结

    本次作业参考文件 正则表达式参考资料 1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2. 书面作业 将Student对象(属性:int id, String ...

  4. 201521123079《java程序设计》第10周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结异常与多线程相关内容. 1.实现多线程的方式: 方式一:继承Thread类 a.自定义类继承Thread类 b.在自定义类中重写ru ...

  5. JSP引入 - UEditor 富文本编辑器

    UEditor  JSP 因为是项目第一天就导入了,现在过去一个多星期了,可能会有问题 官网:http://ueditor.baidu.com/website/ 1. 解压对应的UEditor压缩包至 ...

  6. 读取指定excel,修改并某个值并另存到指定路径

    HSSFWorkBook是解析excel2007以前的版本(xls)之后的版本使用XSSFWrokBook(xlsx) 附:处理excel2007之后的版本代码: package gbyp.autoQ ...

  7. linux系统命令<二>----du的使用方法

    1> 要显示一个目录树及其每个子树的磁盘使用情况 du /home/linux 这在/home/linux目录及其每个子目录中显示了磁盘块数. 2> 要通过以1024字节为单位显示一个目录 ...

  8. Shiro第三篇【授权、自定义reaml授权】

    Shiro授权 上一篇我们已经讲解了Shiro的认证相关的知识了,现在我们来弄Shiro的授权 Shiro授权的流程和认证的流程其实是差不多的: Shiro支持的授权方式 Shiro支持的授权方式有三 ...

  9. TypeMismatchException: Provided id of the wrong type for class zhongfucheng.user.entity.User.

    今天在使用SSH框架做项目的时候出现了这个错误,找了我非常非常多的时间!!!!!!! Struts Problem Report Struts has detected an unhandled ex ...

  10. Eclipse读取含有extjs的项目文件时卡死或者编写ExtJS时卡

    新建一个Eclipse或MyEclipse项目时,关掉验证. 项目右键-->Properties-->Builders--> 不勾选(JavaScript Validator.Val ...