search

Home  >  Q&A  >  body text

javascript - ReactJs 使用的意义

刚刚看到一个框架叫ReactJs,是fb和ins开发的,专门做UI用的,网上很多人推荐,但是我看下来看不出什么门道,求大神们给一个使用这个的框架的意义,或者说这个框架用来做什么最好

PHP中文网PHP中文网2817 days ago345

reply all(2)I'll reply

  • 阿神

    阿神2017-04-10 14:42:15

    Model Driven View 很形象, 是最大的一个原因, 因为把人们从手动 DOM 操作当中解放出来了
    现在单页面框架, 知名的 AngularJS, EmberJS 都这么做, Backbone 也有类似的插件
    相关的框架还有 Ractive.js, 是个 DOM 渲染模块, 另外还有些 MVVM 的框架
    单纯的 jQuery 维护 DOM 已经很难满足日益增长的单页面应用规模的需要了

    除了这一个特点, 我想说 React 的设计相比 Angular 更为清晰, 更简单更容易预测
    也许 MVVM 比如 Vue 的实现会比 React 性能还要高, 可是 React 单向数据流这一点学不去
    单向数据流的意义在于, 开发者可以某种程度上假定应用是整个页面刷新而不破坏状态的,
    那么, 每次操作引起数据改变, 他只要考虑怎样把页面渲染对就好了,
    而 MVP, MVVM 之类方案当中, 会需要更多地考虑怎样维护 DOM 状态的事情,
    React 认为可变的数据是容易出问题的, 这也是函数式编程当中的观点
    总之 React 选择了他的方案, 也许思考 React 的 props 和 state 会耗费不少力气, 但结构不错

    有了这样的好处之后, 前端开发就简化了, 回想一下当初 Web 服务端 MVC 是怎么设计的?
    页面是 View, View 触发服务器上 Controller 的事件, Controller 操作和读取 Model 渲染新的 View.. 如此循环
    到了前端 Backbone 单页面怎样, 写大量的 Model, 通过消息机制维护 Model 和 View 相互间的的状态..
    (不清楚 Angular 怎样, 我尝试过 MVVM, 记得当中还是需要事件触发 DOM 状态的)
    而用 React 就更接近于整页渲染, 每次数据改变, DOM 就整体确保正确更新, 很清晰

    我从 Backbone 跟 Vue 切换到 React 之后明显感到思维方式有了转变
    从前我小的单页面应用, 考虑多的是怎么一个个生成 View 和 View, 怎么修改 View 当中的 DOM
    现在我考虑一个 View 更关心界面应该有哪些数据, 对应有几个状态, 怎样切换状态
    而后者使得我开发界面时思路显得非常清晰, 对于状态多的界面处理起来非常有帮助
    也许对于大型的应用消息机制不可少, 不过我目前的看法是 React 把界面逻辑简化了不少

    另外我觉得 React 的 Component 结构更清晰, Component 之间组合也更自然
    相比在 Backbone 里挂载 View, 在 Angular 里创建 View..
    不过我看 Vue 处理 Component 也用了很漂亮的办法,, 没了解过其他框架

    reply
    0
  • PHP中文网

    PHP中文网2017-04-10 14:42:15

    ReactJS就是一个render器

    ReactJS是Facebook推出的产品。在2013年的Qcon大会(上海)上面,当时Facebook的前端工程师做过一次讲座,就专门介绍了ReactJS。

    ReactJS可以看做就是用来Render的。ReactJS是可以达到游戏级别的渲染,fps可以保持在60左右,相当的了不起,它做了一个虚拟dom tree加速了渲染过程,根据当时的数据说比angularjs快20%以上。

    所以其实你的需求是做一个游戏,那么可以看看ReactJS,它被用在Facebook旗下的网站里面。

    ReactJS是Model-Driven View的实现

    首先要知道MDV的概念,这里推荐看看https://github.com/toolkitchen/mdv。最近的angularjs、meteor、canjs等等都是MDV的实现。ReactJS就是MDV的一种实现,现在看来制约MDV的最重要的就是渲染的效率,而ReactJS就是在这一方向上的探索,从这一角度来看,可以尝试看看。

    个人浅见,欢迎交流

    reply
    0
  • Cancelreply