Parashuram's blog
Latest posts
Debugging React Native iOS Apps with Safari
React Native has great developer experience, and the debugging workflow is at the core of the workflows. Today, we use Chrome to debug JavaScript in React Native apps. In this blog, I explore an alternative approach to the debugging workflow using Safari. How debugging works today To start debugging, we open the developer menu (using Cmd+D) and select "Debug with Chrome". This action tells the…
Using Flipper with React Native
Flipper is a great developer tool for debugging mobile apps and quite popular in the Android and iOS communities. As a companion app for the mobile app development process, it provides tools to inspect network traffic and understand the native UI view hierarchy. With its extensible plugin API, Flipper is now an indispensable tool for many developers at Facebook who work on the family of mobile…
Chain React - Measuring Performance of React Native Apps
ChainReact 2019, Portland
Measuring Performance of Hermes in React Native
Facebook announced Hermes , the new JavaScript Engine at the keynote at Chain React 2019. During the talk, we saw some videos and numbers, showing Hermes and the current JavaScript engine side by side. This blog post dives deeper into those experiments and how those experiments were structures. The goal is to make the experiments reproducible and verifiable. Goal The goal of the experiments is to…
Building React Native
React Amsterdam, April 10-12, 2019, Kromhouthal, Amsterdam Building React Native
Lazy Native Modules - React Native (Android)
In a previous post , I wrote about leveraging React Native's built in instrumentation to understand the startup path for React Native apps. Armed with this data, we can start optimizing the various segments of the timeline that corresponding to loading React Native. Target: This post documents ideas to improve startup times for applications that have a many native modules. Background Native…
React Native's new architecture - Glossary of terms
As the React Native team is working on the new architecture , there have been a few terms used to describe the various pieces. This post aims to clarify some of the terms and points to places in the repository with relevant code. The Bridge In the current architecture of React Native, the communication between JavaScript and Java/ObjC happens over "the bridge". This bridge is a queue to send…
Using React Native's Plugins with Flutter (Android version)
Flutter allows you to build beautiful native apps on iOS and Android from a single codebase. Like most cross-platform mobile application development frameworks, platform specific APIs and device capabilities are exposed to the developer environments using plugins . React Native , another framework to build mobile apps using JavaScript and React, also has a similar concept, called Native Modules .…
React Native Performance Playbook - Part I
Getting Ready - Setting Up Instrumentation Over the last six months, I have been working on improving the performance of React Native. I specifically focussed on the startup time in Android brownfield apps and we were able to reduce the time by half. Even as we wait for the new UI architecture ( Fabric ) and synchronous native modules ( TurboModules ) to rein in significant performance wins, there…
React Native Road Map
At ReactConf 2018 (October 25-26, 2018) at Henderson, Nevada, I spoke about React Native's new architecture covering the JavaScript interface (JSI), UI re-architecture (called Fabric) and the new native module system (called TurboModules). I dove into more details and added a little bit of "Star Wars fun" on the same topic at React Next (Nov 4, 2018) at Tel Aviv, Israel.
Chain React 2018 - React Native Fabric Architecture
Chain React Conference 2018, July 11-13 2018, Portland OR Topic: React Native's new Fabric renderer Link to slides - https://www.slideshare.net/axemclion/chain-react-2018-the-state-of-react-native
React Native in an iOS/Android app
As a web developer, the potential to use JavaScript for building iOS and Android apps has always excited me. My first encounter with such a framework was Apache Cordova , an open source project with contributions from individuals and corporations like Google, Microsoft, Adobe, IBM, Intel, etc. I soon became a committer and started building developer tools for it as a part of my previous job. At my…
Reactathon Keynote - Building apps with React Native
Day 2 Keynote - Building apps with React Native March 22, 2018 at Reactathon 2018, San Francisco
A/B Testing for React Native apps with CodePush
A/B Testing (or Split Testing) is a way to optimize user behavior by serving different web pages to a random set of visitors and measuring metrics that determine the relative efficacy of each user interface design. A/B testing on Websites is simple since the changes can be deployed and reverted quickly. On the contrary, doing this on mobile applications may require explicitly defining the scope of…
ChainReact 2017 - Zero to DevOps
Chain React 2017, Portland Title : Zero to DevOps Abstract React Native brought the web’s enviable development patterns to mobile, without needing to sacrifice native UI. Code Push for React Native brings web like release agility to mobile apps by enabling developers to update apps instantly. This talk will cover the next iteration of Code Push and how it fits into a complete suite of DevOps…
React Amsterdam - Web Like Release Agility for React Native Apps
Title: Web like release agility for React Native Apps
React Native Packager vs Haul
What packages faster ? Haul or React Native ? Jump to results A few days ago, the good folks at Callstack.io released an new, drop-in replacement for the React Native packager called Haul . Over the weekend, I ran experiments to compare the performance of the two systems, to understand these two packagers better. I also wanted to see if I can add support for Haul into Mobile Center (an end to end…
Debugging create-react-native-app with VSCode
Expo and Facebook recently released a command line tool called create-react-native-app that makes getting started with React Native easy. With this tool, you can start developing mobile applications for iOS and Android without having to install the SDKs for each of the platforms. This is very similar to the Phonegap Developer App or Ionic View for Cordova apps and works by uploading only the…
ReactConf - Web like Release and Development Agility
ReactConf 2017, Santa Clara Links from the slides Mobile Center and CodePush Sign up at http://mobile.azure.com?utm_source=react_conf_2017 . Pick a repository from Github and Bitbucket, and start build for every commit. Other services include Crashes with full sourcemap support, and Analytics with support for react navigation . Video and blog post showing setting up devops for React Native from…
Exponent Apps - testing on Multiple Form factors
Want to test your exponent app on multiple screen sizes ? Check out maya-kai Exponent is a great way to build mobile apps - you get all the benefits of React Native, with none of the pain of installing the Android SDK or XCode. Since Exponent is now integrated into VSCode , my developer workflow pretty much involves firing up the VSCode editor and debugging the app running on exponent in my…
React Native - Zero to DevOps
Using http://mobile.azure.com to set up the DevOps pipeline for React Native applications
React Native - Under the hood - Connect.tech 2016
React Native under the hood Presented at Connect.tech 2016, Atlanta GA Abstract: ReactNative is a way to create native applications for iOS, Android and Windows devices in JavaScript. In this session, we will look under the covers at the technology that enables ReactNative to drive native user interface components. We will look at a typical developer workflow and the way ReactNative is tied to…
Velocity NY 2016 - Using Chrome Traces to Measure Web and Performance
Velocity Conference, New York, September 19-22 Title Using Chrome traces to measure rendering performance of web pages and mobile apps Abstract Ten years ago, increasing the performance of a website usually meant tweaking the server-side code to spit out responses faster. Today, it is mostly about ensuring that content is delivered to the user as fast as possible. However, it is still very hard to…
ReactRally - Rise of Web Workers
ReactRally - August 25-26, Salt Lake City, UT Direct Link: https://www.youtube.com/watch?v=BJZx4twjt-I&t=46