Once again it is time for Europes biggest React conference 🎉. I would like to give you my experience with the conference as well as a rough overview of the talks (will add the video links once they are uploaded). I hope it helps you to get a better understanding why you should come visit next year too and which talks to have a detailed look at.

The evening before

The organizers of React-Europe had an opening party the day before the conference at a bar near the venue. It was pretty cool; we got free drinks until about 22:00 and afterward a lot of pretty awesome people just bought pitchers and went around to help everyone out. Daniel Banck and I were there for about 4 hours, and it was hard to leave because we had so many great conversations with a lot of different people.

The atmosphere was terrific; I was at no conference before which such an awesome set of people. There were so many cool conversations going on, and everyone invited you to talk to them, discuss awesome stuff (I think react native navigation solutions was the most discussed topic 😂). I had the feeling that you could walk up to everyone and just chat with them about the React ecosystem and everyone was glad to have you. Björn Brauer took it literally, he introduced me to so many people that evening, and it was fantastic.

My longest chat was with Rotem Mizrachi-Meidan, the creator of detox, which I had previously used and where I opened three issues the very same day. It was so nice to discuss a tool you use and love with the creator; I could give him feedback on the docs and hand over my feature requests. We discussed a bit about ways to implement it, and that was very insightful and interesting. This way of collaboration is pretty awesome, and at least for me, conferences are an awesome way to connect people in a very personal way.

For me this party was the biggest thing at the conference, just being able to talk with so many people with very diverse backgrounds about tools and languages you work with all day was a great experience. Solid 10/10 would do again!

The venue

Daniel Banck and I arrived quite early at the venue. The welcome was very warm, and we were handed a lot of awesome dev swag like shirts, sweater, and stickers. The breakfast was pretty nice, and we had a lot of awesome talks even before the conference began. Instead of talking more about the venue, I will just post some images here:

I will update the talks with a more detailed summary once the conference is actually over.

First Day

Brent Vatne guides us through this day and provides a good overview over the day. He introduced each speaker with personal anecdotes, giving the conference a personal touch.

Keynote by Andrew Clark

TL;DR

• React 16 has Fiber, Partials and Error Boundaries in it
• (Most likely) In React 16there will be an API for opting into asynchronous rendering. It still needs to get some clarification on the API surface
• Beyond React 16: Rendering prioritization for offscreen or hidden content & better code splitting support

Video

• Coming soon

What I Learned Benchmarking React by Dominic Gannaway

TL;DR

• Rollups flat modules helped react to get a ~10% improvement in bundle size and load time
• Rollup is a good match for improving performance in libraries
• Google Lighthouse is a great tool for performance benchmarking

Video

• Coming soon

Building High-Quality JavaScript Tools by Christoph Pojer

TL;DR

• New features and improved performance made Jest a lot better and increased the adoption to over 100 companies
• Snapshot tests are great for getting a good coverage and are being compared with having no tests rather then with conventional tests.
• Jest moved to a modular structure, and the modules are already used in different open source projects

Video

• Coming soon

La nouvelle vague by Sunil Pai (“π”)

TL;DR

• The new wave is the movement from runtimes to compilers
• Good examples are Gatsby, next.js, relay & prepack which leverage on compilers to reduce their runtime
• “If you can’t introduce a library gradually, it’s dead on arrival”

Video

• Coming soon

Worse is Better: The Upside of JavaScript Fatigue by Kevin Lacker

TL;DR

• Simplicity is the most important attribute of a software system to determine its success (e.g. React only taking the View layer)
• Simplicity => Popularity => Contributors (= Fatigue, because new projects pop up very often)

Video

• Coming soon

What WebAssembly means for React by Lin Clark

TL;DR

• Current state of Web Assembly may not allow significant performance improvements if the React Reconciler gets ported to Web Assembly
• Down the line, there could be major improvements to the performance & ecosystem by improved APIs and tooling

Video

• Coming soon

Practical Confidence by Adam Perry

TL;DR

• “Types are tests for the structure of your data”
• Type annotations reduce the cognitive overhead of figuring out the type of variables in your code, also through editor integration
• Flow has a lot of inference features, so only the exports of a module need to be typed most of the time

Video

• Coming soon

Imperfection by Cheng Lou

TL;DR

• Software Engineering means making trade-offs; choosing the right ones is an art
• Doing 80% with 20% of the efforts is good enough most of the times. This only applies if your foundation (language, type system, etc.) is solid (100%)
• “Grow your slopiness budget by approaching certain parts as e.g. the foundation with a 100% mentality

Video

• Coming soon

Maximally Modular Apps with React Navigation by Eric Vicenti

TL;DR

• demonstrated the power of react-navigation with a small demo app
• react-navigation can be used in web and native

Video

• Coming soon

How Streaming Can Supercharge React by Sasha Aickin

TL;DR

• Time to first render and time to first interaction is important for a business
• Client Side loading gives a bad user experience, Server Side Rendering is better but has a long time of non-interactive sites
• Chunked Rendering allows different parts of the application to load individually, which also leads to better fault tolerance

Video

• Coming soon

⚡ Talks

• return null; by Joshua Comeau: Using components for other things than rendering UI can be valuable, too
• Fancy Footwork by Brendan Moore, Sarah Mogin and Serge Rose: They build a CMS frontend with React and Redux which embraces modular design principles
• ShoutemUI by the Shoutem team: They built a market place for React Native extensions (think authentication)
• Thousand ways to navigate in React Native by Charles Mangwa: He introduced react-router-navigation, a way to navigate in React Native just using components
• Detox by Tal Kol & Rotem Mizrachi-Meidan: They created an E2E testing framework for React Native that is very easy to use, stable and fast
• Devtools for GraphQL by Danielle Man: The Apollo team developed a Chrome Extension for developing with Apollo with features like Query watching and Store inspection

Second Day

And once again Brent Vatne guided us through the day. In the morning people came in a bit later than yesterday, a lot have gathered yesterday evening at the frog, where we already met the day before.

Next generation state management by Michel Weststrate

TL;DR

• He introduce mobx-state-tree, a new way to use the graph-based advantages of MobX and combine them with the tree based advantages of Redux
• He demoed the Redux TODO MVC App with an exchanged MobX reducer and displayed features like time traveling

Video

• Coming soon

Composition by Nik Graf

TL;DR

• State in composition is error prone. Therefore we should embrace function programming paradigms as higher-order functions & components
• He showed how the polished library and an app with Apollo that used HOC for loading screens

Video

• Coming soon

The making of Twitter Lite by Nicolas Gallagher

TL;DR

• Twitter Light has a better performance in load time as well as data consumption and time to interaction
• It doesn’t use Server Side Rendering; he explained why in detail
• Think about disposability of parts of your application while designing the system

Vide0

• Coming soon

⚡ Talks

• Snack by Brent Vatne: Use react-native in the browser on https://snack.expo.io/
• React Native Components in Android Apps by Petter Hesselberg: See the demo at https://github.com/petterh/react-europe-demo
• Quantifying Best Practices by Jackson Hamburger and Louis Antonelli: How pure components and key props improve your performance
• Leveraging code-splitting by Glenn Reyes: Intro to dynamic import statements with babel and webpack
• Smarter code-splitting and preloading by Brandon Dail: A brief and good introduction to react-loadable and react-perimeter
• Rise of low-configuration tools by Karl Horky: Configuration leads to many bad effects for open source; add them only when really needed

Exploring Relay Modern by Lee Byron

TL;DR

• Relay Modern shifts assumptions from dynamic queries to static ones, allowing compilers to do ahead of time optimizations
• These optimizations lead to better performance and less network traffic (900ms win on Facebook Marketplace app)
• You can introduce Relay Moderns API step by step and once you finished the conversion switch to it completely

Video

• Coming soon

Animating the Virtual DOM by Sarah Drasner

TL;DR

• Animation is very important to keep the users attention and reduce perceived waiting times
• For every job there is the right tool, CSS-in-JS for simple transitions, GreenSock for sequencial & complex movements, React-Motion for simple, physics based animations

Video

• Coming soon

Credits

Special thanks to Daniel Banck for being a partner in crime at this conference and providing all the images 💙

Want to hear more from me? Feel free to subscribe to my newsletter; I send out news roughly once a month.