Real Talk JavaScript

Episode 1: Scaling React with Brian Holt

Episode Summary

John and Ward talk to Brian Holt about his experiences scaling react and other javascript based applications. Brian discusses the roles that the human element, dev ops, linting, building, the libraries themselves and state management play in scaling javascript, based on his experiences at Reddit, LinkedIn and Netflix.

Episode Notes

Recording date: 2018-09-11

Tweet

John Papa https://twitter.com/john_papa

Ward Bell https://twitter.com/wardbell

Brian Holt https://twitter.com/holtbt

(0:01:23) "Lady Gaga" writes in for the mailbag

(0:03:25) How do we tackle the challenges we face in web development

(0:05:55) Brian discusses his view on scaling to human teams

(0:06:20) Defining "large" applications, and application size

(0:07:10) How the human dimension plays into scale

(0:07:15) Scaling Angular http://angular.io/ at Reddit

(0:08:10) Brian discusses how you don't miss a business deadline

(0:09:40) Communication between engineers, product teams, design teams, and C levels is important

(0:09:59) Ward asks how to balance process vs getting things done

(0:11:15) Brian talks about his experience with process at Netflix

(0:12:57) LinkedIN and having a real Jira expert to set up the process and investing in their tools

(0:15:36) DevOps experiences can be very different for Node.js

(0:16:25) Brian talks about the importance of getting a full CI pipeline and high code quality

(0:17:10) Brian says code doesn't age well, so tools like ESLint help create guidelines

(0:17:45) Brian talks about how he uses TypeScript with React https://reactjs.org/

(0:20:55) Brian states "that which you cannot automate, you cannot enforce"

(0:22:30) Nit picks and their effect on development

(0:23:52) John asks Brian about the usage of Flow https://reactjs.org/docs/static-type-checking.html and TypeScript
https://www.typescriptlang.org/ in React

(0:29:20) Brian discusses when to delete code and keeping code easier to read

(0:30:50) Brian loves opening PRs with more deletion that additions

(0:32:00) Ward asks Brian how communication works up and down, and across the component trees in React

(0:33:01) Brian talks about Prop drilling https://reactjs.org/docs/components-and-props.html

(0:33:37) Brian talks about Flux http://facebook.github.io/flux/docs/overview.html#content and Redux
https://redux.js.org/

(0:35:00) Brian tells us about something that's better for data state management (Suspense)

(0:35:00) Dan Abramov https://twitter.com/dan_abramov and Suspense in React https://www.youtube.com/watch?v=6g3g0Q_XVb4

(0:37:00) Brian says most of the time context https://reactjs.org/docs/context.html will serve you better than Redux

(0:38:30) John says someone to follow is Max Koretskyi - https://twitter.com/maxim_koretskyi
https://blog.angularindepth.com/

(0:39:12) Ward says someone to follow is Rick Strahl https://twitter.com/RickStrahl

(0:39:12) Rick has a blog post questioning if css/html has evolved far enough https://weblog.west-
wind.com/posts/2018/May/31/Web-Code-is-a-solved-Problem-How-about-fixing-Web-UI-next

(0:40:39) Brian says someone to follow is Necoline Hubner https://twitter.com/necolinehubner

More Resources

react https://reactjs.org/

redux https://redux.js.org/

ngrx (redux in Angular) https://medium.com/ngrx

vuex (redux in Vue) https://vuex.vuejs.org/

Webpack https://webpack.js.org/

Parcel https://parceljs.org/

React's context API: https://reactjs.org/docs/context.html

React’s forthcoming “timeslice” and “suspense” APIs: https://blog.pusher.com/time-slice-suspense-api-react-17/

Maxim Koretsky ("ngWizard”) https://blog.angularindepth.com/@maxim.koretskyi