---
id: videos-zh-CN
title: 视频
permalink: docs/videos-zh-CN.html
prev: conferences-zh-CN.html
next: complementary-tools-zh-CN.html
---
### Rethinking best practices - JSConf.eu {#rethinking-best-practices---jsconfeu}
< iframe width = "650" height = "366" src = "https://www.youtube-nocookie.com/embed/x7cQ3mrcKaY" frameborder = "0" allowfullscreen > < / iframe >
"在 Facebook 和 Instagram, 我们正在努力挑战React在web上能达到的极限。我的讲话会从对框架的简单介绍开始,然后深入三个有争议的话题:扔掉模板的概念并用JavaScript构建views, 当数据改变 “re-rendering” 你的整个应用,以及一个DOM和events的轻量级实现。" -- [Pete Hunt ](http://www.petehunt.net/ )
* * *
### Thinking in react - tagtree.tv {#thinking-in-react---tagtreetv}
一个 [tagtree.tv ](http://tagtree.tv/ ) 传达 [Thinking in React ](/docs/thinking-in-react.html ) 原则的视频 在构建一个简单app时。
< figure > < a href = "http://tagtree.tv/thinking-in-react" > < img src = "../images/docs/thinking-in-react-tagtree.png" > < / a > < / figure >
* * *
### Secrets of the Virtual DOM - MtnWest JS {#secrets-of-the-virtual-dom---mtnwest-js}
< iframe width = "650" height = "366" src = "https://www.youtube-nocookie.com/embed/h3KksH8gfcQ" frameborder = "0" allowfullscreen > < / iframe >
"在这次讲座里,我会讨论为什么我们构建了一个虚拟 DOM,它比起其他系统如何,以及它与未来浏览器技术的关系。" -- [Pete Hunt ](http://www.petehunt.net/ )
* * *
### Going big with React {#going-big-with-react}
"理论上,所有的JS框架都大有可为:干净的实现,快速的代码设计,完美的执行。但是当你压力测试时Javascript会怎样?当你丢进6MB的代码时会怎样?在这次演讲中,我们会探究React在高压环境下如何表现,以及它如何帮助我们的团队在大规模时构建安全代码。 "
< figure > < a href = "https://skillsmatter.com/skillscasts/5429-going-big-with-react#video" > < img src = "https://i.vimeocdn.com/video/481670116_650.jpg" > < / a > < / figure >
* * *
### CodeWinds {#codewinds}
[Pete Hunt ](http://www.petehunt.net/ ) 与 [Jeff Barczewski ](http://jeff.barczewski.com/ ) 在 CodeWinds Episode 4 上关于 React 的谈话.
< figure > < a href = "http://codewinds.com/4" > < img src = "../images/docs/codewinds-004.png" > < / a > < / figure >
< table width = "100%" > < tr > < td >
02:08 - 什么是React,为什么我们用它?< br / >
03:08 - ClojureScript 和 React 的共生关系< br / >
04:54 - React 的历史以及为什么它被创造< br / >
09:43 - 用React更新Web页面,而不绑定数据< br / >
13:11 - 用虚拟DOM来改变浏览器DOM< br / >
13:57 - 用React编程,绘制目标HTML,canvas和其他< br / >
16:45 - 和设计师一起工作,对比于Ember 和 AngularJS< br / >
21:45 - JSX编译器桥接HTML和 React javascript< br / >
23:50 - React的自动绑定JSX以及浏览器内工具< br / >
24:50 - 用React工作的提示和技巧,入门< br / >
< / td > < td >
27:17 - 在服务器端用Node.js渲染HTML。后端渲染< br / >
29:20 - React在Facebook通过优胜劣汰进化< br / >
30:15 - 用web sockets,在服务器端和客户端持有状态的想法持有< br / >
32:05 - 多用户React - 用 Firebase 分布式共享可变状态< br / >
33:03 - 用状态转换,事件重放来更好的调式React< br / >
34:08 - 来自Web组件的不同之处< br / >
34:25 - 使用React的著名公司< br / >
35:16 - 一个React的后端插件可以用来创建PDF吗?< br / >
36:30 - React的未来,下一步是什么?< br / >
39:38 - 贡献和获得帮助< br / >
< / td > < / tr > < / table >
[Read the episode notes ](http://codewinds.com/4 )
* * *
### JavaScript Jabber {#javascript-jabber}
[Pete Hunt ](http://www.petehunt.net/ ) 和 [Jordan Walke ](https://github.com/jordwalke ) 在 JavaScript Jabber 73 上关于React的谈话.
< figure > < a href = "http://javascriptjabber.com/073-jsj-react-with-pete-hunt-and-jordan-walke/#content" > < img src = "../images/docs/javascript-jabber.png" > < / a > < / figure >
< table width = "100%" > < tr > < td >
01:34 – Pete Hunt 介绍< br / >
02:45 – Jordan Walke 介绍< br / >
04:15 – React< br / >
06:38 – 60 帧每秒< br / >
09:34 – 数据绑定< br / >
12:31 – 性能< br / >
17:39 – Diffing 算法< br / >
19:36 – DOM 操纵
< / td > < td >
23:06 – 支持 node.js< br / >
24:03 – rendr< br / >
26:02 – JSX< br / >
30:31 – requestAnimationFrame< br / >
34:15 – React 和应用< br / >
38:12 – React 用户 Khan Academy< br / >
39:53 – 使其工作
< / td > < / tr > < / table >
[Read the full transcript ](http://javascriptjabber.com/073-jsj-react-with-pete-hunt-and-jordan-walke/ )
* * *
### Introduction to React.js - Facebook Seattle {#introduction-to-reactjs---facebook-seattle}
< iframe width = "650" height = "366" src = "https://www.youtube-nocookie.com/embed/XxVg_s8xAms" frameborder = "0" allowfullscreen > < / iframe >
由 [Tom Occhino ](http://tomocchino.com/ ) 和 [Jordan Walke ](https://github.com/jordwalke )
* * *
### Backbone + React + Middleman Screencast {#backbone--react--middleman-screencast}
< iframe width = "650" height = "488" src = "https://www.youtube-nocookie.com/embed/iul1fWHVU6A" frameborder = "0" allowfullscreen > < / iframe >
Backbone 是一个在用React实现 REST API 接口的极好方法。这个屏博展示了用 [Backbone-React-Component ](https://github.com/magalhas/backbone-react-component )如何整合两者. Middleman 是在本例中使用的框架但很容易被替换成其他框架。对此可支持的template可以在[这里](https://github.com/jbhatab/middleman-backbone-react-template) 找到. -- [Open Minded Innovations ](http://www.openmindedinnovations.com/ )
* * *
### Developing User Interfaces With React - Super VanJS {#developing-user-interfaces-with-react---super-vanjs}
< iframe width = "650" height = "366" src = "https://www.youtube-nocookie.com/embed/1OeXsL5mr4g" frameborder = "0" allowfullscreen > < / iframe >
来自 [Steven Luscher ](https://github.com/steveluscher )
* * *
### Introduction to React - LAWebSpeed meetup {#introduction-to-react---lawebspeed-meetup}
< iframe width = "650" height = "366" src = "https://www.youtube-nocookie.com/embed/SMMRJif5QW0" frameborder = "0" allowfullscreen > < / iframe >
来自 [Stoyan Stefanov ](http://www.phpied.com/ )
* * *
### React, or how to make life simpler - FrontEnd Dev Conf '14 {#react-or-how-to-make-life-simpler---frontend-dev-conf-14}
< iframe width = "650" height = "366" src = "https://www.youtube-nocookie.com/embed/YJNUK0EA_Jo" frameborder = "0" allowfullscreen > < / iframe >
**俄语** by [Alexander Solovyov ](http://solovyov.net/ )
* * *
### "Functional DOM programming" - Meteor DevShop 11 {#functional-dom-programming---meteor-devshop-11}
< iframe width = "650" height = "366" src = "https://www.youtube-nocookie.com/embed/qqVbr_LaCIo" frameborder = "0" allowfullscreen > < / iframe >
* * *
### "Rethinking Web App Development at Facebook" - Facebook F8 Conference 2014 {#rethinking-web-app-development-at-facebook---facebook-f8-conference-2014}
< iframe width = "650" height = "366" src = "https://www.youtube-nocookie.com/embed/nYkdrAPrdcw" frameborder = "0" allowfullscreen > < / iframe >
* * *
### React and Flux: Building Applications with a Unidirectional Data Flow - Forward JS 2014 {#react-and-flux-building-applications-with-a-unidirectional-data-flow---forward-js-2014}
< iframe width = "650" height = "366" src = "https://www.youtube-nocookie.com/embed/i__969noyAM" frameborder = "0" allowfullscreen > < / iframe >
Facebook 工程师 [Bill Fisher ](https://twitter.com/fisherwebdev ) 和 [Jing Chen ](https://twitter.com/jingc ) 谈论 Flux 和 React, 以及如何使用单向数据流的程序架构清理他们的代码 .
* * *
### Server-Side Rendering of Isomorphic Apps at SoundCloud {#server-side-rendering-of-isomorphic-apps-at-soundcloud}
< iframe src = "https://player.vimeo.com/video/108488724" width = "100%" height = "365" frameborder = "0" webkitallowfullscreen mozallowfullscreen allowfullscreen > < / iframe >
来自 [Andres Suarez ](https://github.com/zertosh ) 的演练,关于 [SoundCloud ](https://developers.soundcloud.com/blog/ ) 如何使用 React 和 Flux 在服务器端渲染.
[幻灯片和示例代码 ](https://github.com/zertosh/ssr-demo-kit )
* * *
### Introducing React Native (+Playlist) - React.js Conf 2015 {#introducing-react-native-playlist---reactjs-conf-2015}
< iframe width = "650" height = "366" src = "https://www.youtube-nocookie.com/embed/KVZ-P-ZI6W4?list=PLb0IAmt7-GS1cbw4qonlQztYV1TAW0sCr" frameborder = "0" allowfullscreen > < / iframe >
[Tom Occhino ](https://twitter.com/tomocchino ) 回顾了React的过去和现在,在2015年。梳理了下一步要做什么。