Sep 2017
11 Mon
12 Tue
13 Wed
14 Thu 08:30 AM – 05:45 PM IST
15 Fri
16 Sat
17 Sun
Submitted Jun 3, 2017
Learn how to build performant applications with React and make your developer experience super sweet.
Let’s talk about server rendering, loading strategies and progressive enhancement to fulfil the gold standard performance checklist without breaking a sweat.
Start with a badly designed app and make it awesome. This workshop is a step by step refactor of a badly performing React application (instagram clone)
Uses concepts from my talk proposal: https://reactfoo.talkfunnel.com/2017/4-building-applications-for-the-next-billion-users
Concepts:
Performance
1.1 Why should you care about performance?
1.2 How to measure performance
1.3 Metrics that matter (meaningful paint, time o interaction)
Where to start?
2.1 Performance budget
2.2 Server side rendering (get to meaningful paint fast)
2.3 Javascript loading strategies (serving the least amount, page-specific, code splitting, etc)
2.4 Lazy loading good-to-have features, analytics et al (second level of code-splitting)
Code time:
Upgrade tooling
1.1 Code structure
1.2 Server
1.4 Bundling (webpack)
1.5 Developer experience (webpack dev middleware, hot module replacement, etc.)
Styling
2.1 CSS-in-JS: Why?
2.2 CSS-in-JS: Implementation
Performance optimisations
3.1 Route specific code spliting
3.2 Lazy loading
3.3 Data fetching on the server
3.4 Swap with preact
Laptop with node + npm installed.
Folks who have built a react application or two. This isn’t very beginner friendly.
Why should you let me talk about this/Why am I excited about it?
{{ gettext('Login to leave a comment') }}
{{ gettext('Post a comment…') }}{{ errorMsg }}
{{ gettext('No comments posted yet') }}