关于 React 社区

Presenter Notes

关于我

  • ChenYong
  • React 社区, ClojureScript 社区
  • Ele.me , Teambition

Presenter Notes

React

  • React 16, Fiber, SSR
  • React Native
  • create-react-app
  • Prettier
  • Prepack
  • Next.js
  • Flow
  • ReasonML, BuckleScript

Presenter Notes

React Fiber

细粒度地控制 DOM 操作,在用户体验上更流畅。 优先处理对于用户重要的界面更新,在性能不足时限制动画的更新。

Fiber 目前处于 Beta 状态。

Presenter Notes

Next.js

服务端渲染的框架。可以快速创建项目。

SSR(服务端渲染),React 16 一起更新。

Presenter Notes

Prettier

格式化代码的工具。在保存文件时把代码生成到团队统一的格式,减少的语法分歧造成的影响。

https://prettier.io/playground/

提供了各种编辑器的插件。

Presenter Notes

一些趋势

  • 面向对象增强函数式编程, React, Rx
  • 类型系统, ReasonML, TypeScript
  • 强大的编译器,工程化
  • JavaScript 提高

Presenter Notes

函数式编程

  • 纯函数,不可变数据
  • 高阶函数,比如: lodash, ramda, Rx

好处:得到更多的代码抽象的方案,在语法使用上更加灵活。 纯函数也可以提高代码的可预测性。

Presenter Notes

ClojureScript

  • FP
  • DSL(JSX),Lisp
  • Virtual DOM, React

https://github.com/clojure-china/cljs-book

Presenter Notes

类型系统

  • TypeScript -- 微软
  • Flow, OCaml, ReasonML -- Facebook
  • Elm, PureScript -- 开源社区

好处,提高代码质量,提前发现问题减少运行时错误

Presenter Notes

编译器

  • Webpack
  • Babel

实现代码混淆, tree shaking, Code splitting, 代码动态加载.

CSS 打包. Inline CSS 打包优化.

Presenter Notes

JavaScript 性能

  • V8 引擎优化
  • Prepack, 预先展开 JavaScript 代码, 优化启动的初试时间
  • WebAssembly, 二进制字节码, 强类型
  • Binary AST, 提前把 JavaScript 编译成二进制的 AST 加快代码加载

Presenter Notes

Thanks

Presenter Notes