Its all about performance… @ReactFoo Delhi 2018

eesh tyagi
ReactFoo
Published in
5 min readAug 30, 2018

The Delhi edition of ReactFoo was attended by more than 100 React enthusiasts on 18th August in the heart of city at— India International Centre (IIC), Lodhi Gardens.

Participants at ReactFoo Delhi, India International Centre (IIC)

ReactFoo is India’s premier React conference. They covered topics pertaining to React application performance, new React version architecture, WebVR and GraphQL. From my first ever conference talk to networking to conference talks, this post narrates some of the best memories.

Our Hardworking MCs

Great work done by our lively MCs Praveen Puglia and Subramanya Chakravarthy. Right on time from beginning to end.

React Internals — How understanding React implementation can help us make better apps

Ankit Muchhala started the session with the internals of React and the deep dive into the architecture of new version React Fiber. He also explained about the complexity of diffing algorithm during the rendering phase and how React uses heuristic diffing algorithm to optimise rendering performance.

Slides: https://www.slideshare.net/AnkitMuchhala/react-internals-how-understanding-react-implementation-can-help-us-write-better-code

Building Microfrontends with React

Next Up was Nisheedh J who spoke about Micro frontends explaining how to build functional and decoupled react components which are single page applications in itself, and can be deployed independently.

Create your own Custom Async Renderer with diffing in Web Worker

Aziz Khambati beautifully presented how to make your own custom render engine using Web Workers. He also mentioned React fibre and its benefits, and the future of React.

Some helpful links related to the talk:

  1. Slides: https://drive.google.com/file/d/1AOGiEXloRxH5QB2TiN3tQpmXWuTxqhBU/view
  2. https://azizhk.github.io/rrrww/

Why we should use React Canvas

It was a great learning experience by Arwa Lokhandwala for the use of React canvas for seat selection and providing silky smooth UX.

Arwa Lokhandwala explaining react canvas and rendering process

Slides:

Page loading performance strategies from the field

Next up was Prateek Rungta speaking on different strategies to improve page load performance and their case studies at Miranj. He explained it with a nice touch of animation and cartoon characters.

Prateek Rungta with Captain Planet Analogy

Slides:

Hidden performance gems in chrome dev tools we use @Microsoft

We had Rachit Gulati from Microsoft speaking on Hidden performance gems in Chrome dev tools used at Microsoft. The talk covered a lot on how to extensively use Chrome dev tools to manage memory leaks and measure site performance. Also he explained how to efficiently benchmark every pull request before merging it.

Some helpful links related to the talk

  1. Slides: https://drive.google.com/file/d/1D9qqNJizjKPdDtBOWE-g_dTI3J65yJ6C/view

Cleartrip’s reactive journey from 3 to 0.2s using Apollo GraphQL

Now it was my turn to share a case study on using Apollo GraphQL in Cleartrip’s migration from legacy code to PWA. I was a bit nervous being a first time speaker, but luckily it went well. I talked about how we can remove dependency around REST APIs and make client unaware of API changes. I was able to explain that with a live demo as well.

Building blazingly fast websites with Gatsby

Kiran Abburi (@kiranabburi) gave his talk on Building blazingly fast websites with Gatsby. He explained how Gatsby works, how easily can we leverage code splitting, loading critical assets, prefetching, etc from the framework and can reuse plugins to decrease the turn around time for a site.

Kiran Abburi explaining Gatsby

Deploying with confidence

Vaibhav Lokhande (@vaibhav7779) working at Shaadi.com explained the importance of Test driven Environment. He explained different ways to become confident in deploying to production while reducing the manual QA cycles. He also spoke about TDD, storybook in react and Automated testing frameworks like cypress.

Vaibhav Lokhande explaning the TDD cycle

Slides:

<Text style={ali-c fnt-b}/> Bootstrap your own style sheet for React native

Kalpit Champanery spoke about styling React native components like you style it for the web (HTML) using CSS/Bootstrap. He proposed a simpler solution for styling react native components.

Slides: https://prezi.com/k5uixltmhzmq/text-styleali-c-fnt-b-bootstrap-your-own-style-sheet-for-react-native/

Piggybacking your WebVR/AR experiences with React

Last talk was by Shivank Shekhar. He talked about the power of AR/VR in web and native. He has shown us a way on how we can utilise the technology to implement powerful prototypes using 3D scenes by using libraries like Aframe, React 360 and various other libraries.

Shivank Shekhar talking about power of AR/VR in web and native

Slides: https://speakerdeck.com/geekyshiva/ar-experiences-with-react-1

In a nutshell it was an amazing experience to be amongst such brilliant speakers and meet so many like minded fellows. Shout out to all of the members behind the scene who worked around the clock to make this a huge success. Really looking forward to be able to participate in ReactFoo 2019 in March.

Customary ReactFoo speaker line up

--

--