2015-02-26 孙镜涛 InfoQ
Eric Florenzano最近在自己的博客上发表了一篇题为《Facebook教我们如何构建网站》的文章,他认为软件开发有些时候需要比较大的跨越,而这将会在2015年再次上演,主角们则是Facebook的React.js、Relay和GraphQL。
Eric Florenzano在该文章中提到:2003年Brad Fitzpatrick发布了Memcached,由此开启了LiveJournal架构的时代;2004年Google发布了MapReduce论文,由此诞生了Hadoop并开始风靡世界;2007年Amazon发布了Dynamo存储系统,让我们知晓了如何通过线性扩展的方式让数据库和应用程序一起工作,并导致了Cassandra、Riak等数据库的产生;2010年Twitter教会了我们如何通过客户端模板让服务器端变成一些简单的API,并引发了Web应用的又一次大转变;2012年Google发布了Angular.js 1.0,并最终成为流行的Web开发框架,这一切都有一个共同点,那就是:公司或者创业团队从生产中得到了沉痛的教训,从失败中找到了向前的出路,然后在将自己的技术突破共享出来的时候引发了一系列的变革。Fitzpatrick相信,在2015年Facebook将会通过React.js、Relay和GraphQL三把利剑引发Web应用开发的另一次跨越。
Fitzpatrick做出如此判断的理由主要是基于Facebook的员工在一些演讲中所透露出的Web开发理念。例如,Pete Hunt在2013年的JSConf上做了题为《React:重新思考最佳实践》的演讲,讲述了Facebook之所以会避开某些“最佳实践”的原因,Pete Hunt认为JS模板分离了技术,但是并没有分离关注点,而框架并不知道如何分离关注点,解决这一问题的方案是组件,要充分利用JavaScript的能力,削弱模板的作用;Daniel Schafer和Jing Chen在2015年的React.js Conf上讲述了Facebook如何通过GraphQL改变既有的数据获取方式,让开发者更容易地在React应用中获取数据;Christopher Chedeau在《React:CSS in JS》中讲述了在大规模使用CSS时所面临的问题以及如何通过JS来解决。
总的来说,Facebook提出的Web开发理念可以概括为:将应用分解为一个个独立的组件,与该组件相关的样式、标记、验证以及数据要求都放到组件定义的内部,对于自我渲染所需的所有数据每一个组件都有明确的声明且保存在该组件内部,同时对于哪些行为会改变组件的状态,组件状态改变之后会有哪些反应也要有明确的定义。通过这种方式编写的组件能够封装它自身的逻辑,使得组件高内聚,组件之间低耦合,增强了复用性,同时也降低了开发人员的运维难度和复杂性。
毫无疑问,Facebook提出的技术与理念对于大部分Web网站开发团队而言还是有一定借鉴意义的,其中的思想也值得我们深思与学习,但是Fitzpatrick的判断是否真的会实现,Facebook的React.js、Relay和GraphQL是否会引发Web开发的再一次变革,只有等待时间来验证了。
Facebook的Web开发三板斧:React.js、Relay和GraphQL的更多相关文章
-
移动web端的react.js组件化方案
背景: 随着互联网世界的兴起,web前端开发的方式越来越多,出现了很多种场景开发的前端架构体系,也对前端的要求日益增高,早已经不是靠一个JQuery.js来做前端页面的时代了,而今移动端变化最大,近 ...
-
Web框架概述——React.js
目前,在前端Web开发中,三大热门框架为React.js,Vue.js,Angular.js .当然,三大框架各有各的优缺点,这里就不多说了,下面我就针对前段时间所学的React框架做一下整体知识点的 ...
-
web开发与设计--js数据类型,js运营商
1. js数据类型划分:号码值类型,布尔,串 由typeof能够看到什么类型的数据被详述. 举例: <span style="font-family:Microsoft YaHei;f ...
-
web开发常用的js验证,利用正则表达式验证邮箱、手机、身份证等输入
正则表达式验证 //邮箱 \-])+\.)+([a-zA-Z0-]{,})+$/; email = document.getElementById("email").value; ...
-
微信web开发的上传图片js接口
$('.chooseImage').click(function(){ wx.chooseImage({ count: pic_num, // 默认9,大于9也是显示9 sizeType: ['com ...
-
使用 React.js 的渐进式 Web 应用程序:第 1 部分 - 介绍
使用 React.js 的渐进式 Web 应用程序:第 1 部分 - 介绍 使用 React.js 的渐进式 Web 应用程序:第 1 部分 - 介绍 来自译者 markzhai:大家也知道最近 ...
-
Snap.svg – 现代 Web 开发必备的 JavaScript SVG 库
SVG 是一种很好的 Web 技术方案,可以用来创建互动,在任何大小的屏幕上都会很好看.与分辨率无关的矢量图形.而这里推荐的 Snap.svg 这个 JavaScript 可以让你像 jQuery 操 ...
-
6个好用的Web开发工具
在过去的几年间,涌现出了很多Web开发工具,它们大多还是比较吸引人的,方便了我们的工作.我们可以学习一下这些新东西,短时间就可以拓宽思路(PHP100推荐:学习10分钟,改变你的程序员生涯).这些应用 ...
-
PHP开发人员对JAVA的WEB开发入门(初版-已废弃)
最近准备对其他部门PHP开发的童鞋做一个对JAVA的培训.知己知彼,百战不殆,我要先了解点PHP,才能确认他们的基础,达到好的授课效果. PHP(原始为Personal Home Page的缩写,后正 ...
随机推荐
-
CYQ.Data 从入门到放弃ORM系列:开篇:自动化框架编程思维
前言: 随着CYQ.Data 开始回归免费使用之后,发现用户的情绪越来越激动,为了保持这持续的激动性,让我有了开源的念头. 同时,由于框架经过这5-6年来的不断演进,以前发的早期教程已经太落后了,包括 ...
-
【转】Oracle 表空间与数据文件
--============================== --Oracle 表空间与数据文件 --============================== /* 一.概念 表空间:是一个或 ...
-
Codevs 1140 Jam的计数法 2006年NOIP全国联赛普及组
1140 Jam的计数法 2006年NOIP全国联赛普及组 传送门 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题目描述 Description Jam是个喜欢标 ...
-
Oracle database启动过程分析
实例跟数据库的区别 实例(instance)是内存中的一块区域和一组后台进程的集合.它的作用是维护数据库文件的.而数据库(database)则是指存放数据的数据库文件.它是一系列格式化的数据的集合.它 ...
-
Debian8 安装wordpress博客
首先要安装 php5-gd 已保证wordpress可以正常安装 下载Wordpress wget http://wordpress.org/latest.tar.gz 解压 tar -xzvf la ...
-
ul 和 ol 标签的相关设置
初学者不喜欢 ul 标签的最重要一点莫过于其前面的黑点了,每次写个无序列表其前面总有一个黑点是个很讨厌的事,去掉黑点的话自然是要用到 list-style:none:这条css 属性设置了. p.p1 ...
-
LB+nginx+tomcat7集群模式下的https请求重定向(redirect)后变成http的解决方案
0. 环境信息 Linux:Linux i-8emt1zr1 2.6.32-573.el6.x86_64 #1 SMP Wed Jul 1 18:23:37 EDT 2015 x86_64 x86_6 ...
-
LinearLayout 线性布局
android:orientation 设置布局管理器内组件的排列方式,可设置为 horizontal (水平排列).vertical (垂直排列) android:gravity 设置布局管理器内组 ...
-
[LintCode笔记了解一下]39.恢复旋转排序数组
思路: 1.需要O(n)的事件复杂度,所以多次循环不考虑 2.四步翻转法 -第一步,找到数组里最小的那个数字,因为是旋转排序数组,所以只要找到某个位置arr[i]>arr[i+1]的话,就找到了 ...
-
kettle-批量同步表数据
一.实验目标 利用kettle实现从mysql数据库中的dbf库批量同步表到dbm库(全量同步) 二.实验环境 dbf 库中表f1.f2.f3 .f1中1条数据,f2中100条数据,f3中2条数据 ...