Once again it is time for Europes biggest [React](https://hackernoon.com/tagged/react) [conference](https://hackernoon.com/tagged/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](https://medium.com/@ReactEurope/reacteurope-bar-night-party-on-the-17th-of-may-for-reacteurope-attendees-e0744e80702) 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](https://medium.com/@dbanck) 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.

**Video**

*   Coming soon

#### What I Learned Benchmarking React by [Dominic Gannaway](https://medium.com/@trueadm)

**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](https://developers.google.com/web/tools/lighthouse/) is a great tool for performance benchmarking

![](https://hackernoon.com/hn-images/1*WQaSRMWAYeNxXLM_1xUG0A.jpeg)

**Video**

*   Coming soon

#### Building High-Quality JavaScript Tools by [Christoph Pojer](https://medium.com/@cpojer)

**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

![](https://hackernoon.com/hn-images/1*lHjgFLRdMaj38gxxDQuELQ.jpeg)

**Video**

*   Coming soon

#### La nouvelle vague by [Sunil Pai](https://medium.com/@threepointone) **(“**[π](https://www.utf8icons.com/character/960/greek-small-letter-pi)”)

**TL;DR**

*   The new wave is the movement from runtimes to compilers
*   Good examples are [Gatsby](https://github.com/gatsbyjs/gatsby), [next.js](https://github.com/zeit/next.js), [relay](https://github.com/facebook/relay) & [prepack](https://github.com/facebook/prepack) which leverage on compilers to reduce their runtime
*   “If you can’t introduce a library gradually, it’s dead on arrival”

![](https://pbs.twimg.com/media/DAGeKDhXkAAUvsA.jpg:large)

**Video**

*   Coming soon

#### Worse is Better: The Upside of JavaScript Fatigue by [Kevin Lacker](https://medium.com/@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)

![](https://hackernoon.com/hn-images/1*aiAn6rWWmoVa3Exf2FZ6rA.jpeg)

**Video**

*   Coming soon

#### What WebAssembly means for React by [Lin Clark](https://medium.com/@linclark)

**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

![](https://hackernoon.com/hn-images/1*yY85zxKI83o7oDqfuGtHMA.jpeg)

**Video**

*   Coming soon

#### Practical Confidence by [Adam Perry](https://twitter.com/dika10sune)

**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

![](https://hackernoon.com/hn-images/1*zWD7h3_KjkdcoiKQSc_kNw.jpeg)

**Video**

*   Coming soon

#### Imperfection by [Cheng Lou](https://twitter.com/_chenglou)

**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

![](https://hackernoon.com/hn-images/1*sbCf-DQaQzRRBV-mMKkuVw.jpeg)

**Video**

*   Coming soon

#### Maximally Modular Apps with React Navigation by [Eric Vicenti](https://medium.com/@ericvicenti)

**TL;DR**

*   demonstrated the power of [react-navigation](https://github.com/react-community/react-navigation) with [a small demo app](https://github.com/ericvicenti/swag-store)
*   react-navigation can be used in web and native

![](https://hackernoon.com/hn-images/1*fESf_o2xcC27gRIPNLS1QA.jpeg)

**Video**

*   Coming soon

#### How Streaming Can Supercharge React by [**Sasha Aickin**](http://xander76)

**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

![](https://hackernoon.com/hn-images/1*fVEQy_nvIyPe7ByJDK_J-A.jpeg)

**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](https://github.com/LeoLeBras/react-router-navigation), a way to navigate in React Native just using components
*   **Detox by** [Tal Kol](https://medium.com/@talkol) & [Rotem Mizrachi-Meidan](https://medium.com/@rotemmiz): 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

![](https://pbs.twimg.com/media/DAIARJHXgAA8XRr.jpg:large)

### Second Day

And once again [Brent Vatne](https://medium.com/@notbrent) 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](https://medium.com/@mweststrate)

**TL;DR**

*   He introduce [mobx-state-tree](https://github.com/mobxjs/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

![](https://hackernoon.com/hn-images/1*0XRH1J8aPFa6ge8IYOcELA.jpeg)

**Video**

*   Coming soon

#### Composition by [Nik Graf](https://medium.com/@nikgraf)

**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](https://github.com/styled-components/polished) library and an app with Apollo that used HOC for loading screens

![](https://hackernoon.com/hn-images/1*AEYWg_5wiiSwQPYcnebdUQ.jpeg)

**Video**

*   Coming soon

#### The making of Twitter Lite by [Nicolas Gallagher](https://medium.com/@necolas)

**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

![](https://hackernoon.com/hn-images/1*ac1b-giDlE1vF1YHg77O-Q.jpeg)

**Vide0**

*   Coming soon

#### ⚡ Talks

*   **Snack by** [**Brent Vatne**](https://medium.com/@notbrent)**:** Use react-native in the browser on [https://snack.expo.io/](https://snack.expo.io/)
*   **React Native Components in Android Apps by** [**Petter Hesselberg**](https://medium.com/@petterhesselberg)**:** See the demo at [https://github.com/petterh/react-europe-demo](https://github.com/petterh/react-europe-demo)
*   **Quantifying Best Practices by Jackson Hamburger and** [**Louis Antonelli**](https://medium.com/@louisantonelli)**:** How pure components and key props improve your performance
*   **Leveraging code-splitting by** [**Glenn Reyes**](https://medium.com/@glennreyes)**:** 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](https://github.com/thejameskyle/react-loadable) and [react-perimeter](https://github.com/aweary/react-perimeter)
*   **Rise of low-configuration tools by** [**Karl Horky**](https://medium.com/@karlhorky)**:** Configuration leads to many bad effects for open source; add them only when really needed

![](https://pbs.twimg.com/media/DAMCmiiUMAEdDdC.jpg:large)

#### Exploring Relay Modern by [Lee Byron](https://medium.com/@leeb)

**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

![](https://hackernoon.com/hn-images/1*YlIorGbuxXAQBZ2uupzEbw.jpeg)

**Video**

*   Coming soon

#### Animating the Virtual DOM by [Sarah Drasner](https://medium.com/@sarah_edo)

**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](https://github.com/greensock/GreenSock-JS) for sequencial & complex movements, [React-Motion](https://github.com/chenglou/react-motion) for simple, physics based animations

![](https://hackernoon.com/hn-images/1*kVAhkq3UYCRN9rc3mo7CGA.jpeg)

**Video**

*   Coming soon

### Credits

Special thanks to [Daniel Banck](https://medium.com/@dbanck) 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._

![](https://buttondown.email/static/images/favicon.ico)

Flow

The Graph

Assembly

React-Europe 2017

Too Long; Didn't Read

People Mentioned

Companies Mentioned

Coins Mentioned

@dschmidt1992

RELATED STORIES