Would Airbnb Have Fared Better With NativeScript Instead of React Native?

Interesting blog post by TJ Vantoll, who works on NativeScript:

In this article we’ll walk through Airbnb’s complaints in detail, and talk about how some of those same problems could’ve been handled in NativeScript. We’ll start with things that NativeScript does well (this is the NativeScript blog after all), and then move on to things NativeScript does, well, less well.

Takes a good look at things like the bridge, the use of TypeScript, the benefits of NativeScript’s single threaded model.

Would Airbnb Have Fared Better With NativeScript Instead of React Native? →

Be sure to also read “State of React Native 2018”. In that post, Facebook announced some changes it’s going to make regarding the bridge/threading:

To make React Native more lightweight and fit better into existing native apps, this rearchitecture has three major internal changes. First, we are changing the threading model. Instead of each UI update needing to perform work on three different threads, it will be possible to call synchronously into JavaScript on any thread for high-priority updates while still keeping low-priority work off the main thread to maintain responsiveness. Second, we are incorporating async rendering capabilities into React Native to allow multiple rendering priorities and to simplify asynchronous data handling. Finally, we are simplifying our bridge to make it faster and more lightweight; direct calls between native and JavaScript are more efficient and will make it easier to build debugging tools like cross-language stack traces.

Really looking forward to these upcoming changes 🙂

React Native at Airbnb

Gabriel Peal, Android developer at Airbnb:

In 2016, we took a big bet on React Native. Two years later, we’re ready to share our experience with the world and show what’s next.

The result is a 5-part series of posts:

Yes that’s right, in part 4 he explains why they’re moving away from React Native as it no longer was a right fit for them:

Because we weren’t able to achieve our specific goals, we have decided that React Native isn’t right for us anymore.

This doesn’t mean they consider React Native to have failed, or that they dislike it:

63% of engineers would have chosen React Native again given the chance and 74% would consider React Native for a new project.

Be sure to read all parts and take your time for it. Lots of information. Lots of nuances. Your mileage may will vary.

React Native at Airbnb →

👨‍💻 Having worked on a *huge* React Native project for De Persgroep (video below) for the past 10 months, most of the things – both bad and good – Gabriel writes sound really familiar.

Unlike Airbnb though, we were fortunate enough to be creating a new app from scratch (instead of plugging RN onto an existing app), and got in to RN way past its pioneering phase (we started at RN 0.47) by which most wrinkles had already been ironed out.

Allemansrätten – Sweden on Airbnb

Allemansrätten – or the freedom to roam – is a principle protected by Swedish law that gives all people the right to be free in Swedish nature. It’s a place where you can eat berries from the ground, sleep under the stars, swim in the lakes and roam freely. To make this home available for everyone, Sweden has listed the entire country on Airbnb.

Airbnb: Visit Sweden →

Easily add high-quality animation to any native app with Lottie

By the folks at AirBnB:

Lottie is an iOS, Android, and React Native library that renders After Effects animations in real time, allowing apps to use animations as easily as they use static images.

Lottie uses a JSON file – generated by the BodyMovin plugin for After Effects as its source, and then renders it with no additional engineering effort.

Here’s a React-based example:

import React from 'react';
import Animation from 'lottie-react-native';

export default class BasicExample extends React.Component {
  componentDidMount() {
    this.animation.play();
  }

  render() {
    return (
      <Animation
        ref={animation => { this.animation = animation; }}
        style={{
          width: 200,
          height: 200,
        }}
        source={require('../path/to/animation.json')}
      />
    );
  }
}

I like this take on creating cross-platform animations, yet it requires one to create his/her animations using After Effects.

Lottie →
AirBnB Design: Introducing Lottie →

Inside AirBnB: New York City

inside-airbnb

Inside Airbnb is an independent, non-commercial set of tools and data that allows you to explore how Airbnb is REALLY being used in New York City.

By analyzing publicly available information about Airbnb’s New York City listings, Inside Airbnb provides filters and key metrics so you can see how Airbnb is being used to compete with the residential housing market.

Inside AirBnB: New York City →