腾讯亿级用户规模自研业务的上云实践解读,立即报名 了解详情
写点什么

Facebook 发布用户界面库 React,业界褒贬不一

  • 2013-06-08
  • 本文字数:1332 字

    阅读完需:约 4 分钟

Facebook 开源了 React ,这是该公司用于构建反应式图形界面的 JavaScript 库,已经应用于构建 Instagram 网站 Facebook 部分网站。最近出现了 AngularJS MeteorJS Polymer 中实现的 Model-Driven Views 等框架,React 也顺应了这种趋势。React 基于在数据模型之上声明式指定用户界面的理念,用户界面会自动与底层数据保持同步。与前面提及的框架不同,出于灵活性考虑,React 使用 JavaScript 来构建用户界面,没有选择 HTML。

JSX 是 JavaScript 的一种支持 XML 字面量的扩展,尽管 React 并不依赖 JSX,但是 React 网站上的示例代码都依赖它。比如,下面是以 React 表示的很有代表性的“Hello World”程序,其中用到了 JSX:

复制代码
/** @jsx React.DOM */
var HelloMessage = React.createClass({
render: function() {
return <div>{'Hello ' + this.props.name}</div>;
}
});
React.renderComponent(<HelloMessage name="World" />,
mountNode);

嵌入的 XML 会在预编译阶段被翻译为正常的 JavaScript DOM API 调用。

自从发布以来,React 库受到了广泛的批评。批评大致可以分为两类,一类是说该库把视图和逻辑混了起来,另一类是说与现有框架相比它的代码冗长。下面我们分别来看一下。

(明显)把视图和控制器混了起来

Reddit 用户 rhysbrettbowen 写道

我理解 JSX 不是必需的,不过我们用了很长时间才把逻辑从 HTML 中抽取出来,现在我们进步了,难道要把 HTML 再放到逻辑里去吗?

没有很好地把 HTML 从业务逻辑中分离出来,这是最大的问题。如果 HTML 和业务逻辑分离,就可以让设计人员负责 HTML 和样式,而编程人员负责代码,并向模板提供钩子。

Facebook React 团队的 Peter Hunt在其博客中对此作出了回应,React 并没有试图把应用程序的视图和逻辑混起来:

我们都还记得过去将 PHP 混在 HTML 中的那些日子,代码很难维护,安全也是事后诸葛亮。我们可不想走老路。

从那时开始,为防止工程师再犯这种错误,我们已经开发了很多客户端和服务器端的模板语言。然而,这些模板语言都是有代价的:用户界面构建起来更为困难。就像交替变换表格中每行的颜色这么简单的事情都要在多种语言中做些处理。

我们应该做的是接受这一点——用户界面会越来越复杂,我们需要一门真正的编程语言并借助其全部表现能力来构建上规模的用户界面。

React 就是信奉这一理念的库。React 仍然鼓励划分关注点:组件只负责传统的 MVC 应用中“视图”的角色。然而,不同于过于简单的模板语言,你应该使用 JavaScript 来构建抽象和复用代码。

与现有框架相比代码冗长

React 发布之后不久, Vlad Yazhbin 贴出了将 React 教程中的代码翻译为 AngularJS 的结果,证明 AngularJS 代码比原始的React 代码更简洁。不过也有人指出,这种比较并不是完全公平的。

即便如此,Facebook 开源了他们开发的更多的库,这种努力开发者社区是非常欣赏的。Facebook 之前备受瞩目的开源产品包括 Hiphop PHP 编译器 Tornado 。其中 Tornado 是一个高效的异步 Python Web 框架,用于构建实时应用,最初是为了推动 FriendFeed 这个网站而构建的。

React 已经放到了 github 上,开发者可以下载开发构建和产品构建等不同版本

查看英文原文: Facebook’s React JavaScript User Interfaces Library Receives Mixed Reviews

2013-06-08 08:089164
用户头像
臧秀涛 略懂技术的运营同学。

发布了 300 篇内容, 共 123.5 次阅读, 收获喜欢 32 次。

关注

评论

发布
暂无评论
发现更多内容

架构师训练营1期 - week07- 作业

lucian

极客大学架构师训练营

Week 7 作業

Christy LAW

springboot 热部署

hepingfly

Java springboot SpringCloud 热部署

7.2全链路压测的挑战

张荣召

第三周-总结

jizhi7

极客大学架构师训练营

Week 7 學習總結

Christy LAW

Week3 代码重构

贺志鹏

极客大学架构师训练营

第七周作业

Geek_ac4080

【架构师训练营第 1 期 07 周】 作业

Bear

极客大学架构师训练营

架构师训练营 1 期 - 第七周总结(vaik)

行之

极客大学架构师训练营

架构师训练营第 1 期 -Week7 - 课后练习

鲁小鲁

极客大学架构师训练营

第三周-课后练习

jizhi7

与前端训练营的日子--Week02

SamGo

学习

7.1性能测试:系统性能的主要技术指标

张荣召

第 7 周 作业

Pyr0man1ac

第七周总结

Geek_ac4080

#链表# #快慢指针#

玉皇大亮

链表 快慢指针

科技与产业革命的历史性交汇期,光华工程科技奖名单上的AI排面

脑极体

架构师训练营第一期 - 第七周学习总结

卖猪肉的大叔

极客大学架构师训练营

架构师训练营 1 期 - 第七周作业(vaik)

行之

极客大学架构师训练营

装饰器模式

猴子胖胖

设计模式 Go 语言

架构师训练营第 1 期 -Week7 - 性能优化一学习总结

鲁小鲁

极客大学架构师训练营

第 7 周 听说你有好几个线程

Pyr0man1ac

第七周 性能优化 作业一

应鹏

极客大学架构师训练营

第七周 性能优化 作业二

应鹏

极客大学架构师训练营

【架构师训练营第 1 期 07 周】 学习总结

Bear

极客大学架构师训练营

week3- 请在草稿纸上手写一个单例模式的实现代码,拍照提交作业

未来已来

架构师训练营第七周学习笔记

一马行千里

学习 极客大学架构师训练营

第3周作业

伊灵

架构师训练营week07作业

IT老兵重开始

week3-作业二:根据当周学习情况,完成一篇学习总结

未来已来

Facebook发布用户界面库React,业界褒贬不一_JavaScript_Zef Hemel_InfoQ精选文章