Name: 改善Facebook市場中的React Native性能--Konstantin Raev | 夏威夷JSConf 2019 (Improving React Native Performance in Facebook Marketplace - Konstantin Raev | JSConf Hawaii 2019)
Uploaded: 2021-01-14T10:27:28.000Z
Duration: 26 min 6 s
Description: 【看影片學英語】數萬部 YouTube 影片，搭配英漢字典即點即查，輕鬆掌握單字發音與用法，長久累積看電影不必再看字幕。

程度副詞

So my name is constant ing and I learned how to use this remote Just another second.

情態副詞

I'll use my finger and I just press space bar s o Our Facebook on market placed him and I mostly focused on performance recently Before joining marketplace in Seattle.

I worked in Facebook UK, and I worked on young package manager.

And before that, I worked on react native.

So I'm a little bit biased towards what framework to choose when you build a mobile app.

What I have been working on for the last year actually making marketplace load faster just before we start.

This talk is I made it so that you could actually take it home.

Some ideas how to make your application faster, specifically react native, but it's also a place to react.

And actually, if you think about it, it applies to any other application.

Uh, anyone used market place before, so it's a platform.

It's actually a tab inside Facebook application.

Anyone knows about Facebook, so it's a social network and there are tabs in it, and marketplace is one of the tabs.

It's a place where you can buy and sell things to people in your community.

So Marketplace started in 2016 and the two cast to build to build the first version for us just six months, and actually we tested it in Hawaii, so it means that the stock sort of brings it back home.

Then it took us just two months to build the Android version, and this is actually quite rare for applications off this size in company off this thing size because it's usually like six months for us, then another six months android.

But because we're used JavaScript and 90% of the code was reused, we were able to do just in two months.

So what officially launched in October 2016 to mainland U.

And some other countries, and now it's global and there are more than 800 million people using this application every month, and marketplace is more than just buying and selling items to people around you.

It's also bowled by in a car finding a place to live are some daily deals, some business opportunities.

It's more than 100 engineers working on the same react native code base.

So market when it plays, grew from 0 to 800 million in just about two years and the two team group as well.

So we need to hire more people, and we need to make the application nice to work with and react.

Native played a big role in how to make a good, ah developer experience so anyone is familiar with hot reloading.

Anyone knows the difference between live reloading and hot reloading.

Loaded is when you develop a website, you change your code.

Type something, save it, and then your browser or application refreshes with the latest code, and you see the changes.

Hot reloading is when you make your changes on your laptop like here, I make some cold, some co changes to my react component.

I press save, and then it goes to the device, and only the components that actually changed get rear ended.

As usual, React re renders components at its pleasure, and this situation is quite fast because I'm just changing called little bit.

And another thing that you probably don't know at Facebook.

We don't like building the Facebook application.

Well, love the application, but building it is not fun because it takes 30 minutes to have a new binary on your device because we have millions of files, something good about react.

As I mentioned, 90% of the code or even more is written in JavaScript, and we don't need to change the native coat that often.

So what we can do is we can grab the latest binary from a build server, install it on the device and then build the JavaScript file from the source code.

That just grabs this binary and does everything with just one single click.

As I told you, Marketplace team has grown a lot to build a lot of features.

And at Facebook we have a joke that it's really hard to find andro developers because we already hired every under a developer who wanted to work for us.

There are more JavaScript developers around Still hard toe.

Less than 5% of people working on marketplace are actually specializing in native platforms.

It doesn't mean that we don't use their skills.

We just leverage their ability to work on something complex, platform specific.

All the other people are quite quick toe adopt to the JavaScript code base and become quite proficient.

Building features rectum wrecked natives are also very popular.

If you can't get help stars, which I do periodically, there it probably in top 10 frameworks on get up by star count.

But if you look at the number of contributors individual people who contribute to the core base react native is one of the top projects and also it built a community around it.

What I'm saying is that when we hire people from outside the work on marketplace, those people are very likely already familiar with our technology technology, and it means step.

So I just described wreck native JavaScript frameworks that allowed us to grow the team fost But what about jealous crypt and being building an application that works fast.

JavaScript has a lot of things that people, people say, that it's not good for performance.

It has model system that's not really mature enough.

How do you build a U ie when single thread it, But thankfully, we actually have a synchronous Gordon Co.

But anyway, a lot of people are are biased about JavaScript on.

So Facebook occasionally surveys people who are using their applications.

And there is a direct correlation between how fast the application loads and how satisfied are people with the application and performance work that we did.

A marketplace in the last year shows that people engage more with application if it loads faster for every 100 milliseconds, there is a certain percent off improvement off how people engage with marketplace.

And I'm not talking about just looking at the screen and I'm going away.

I'm actually meaning that it sticks to people if something loads fast.

So Facebook Application leadership spent some time researching how fussed application should be for people to feel comfortable with it.

And in the last 40 years there have been a lot off researchers, and the consensus is that if the application, if a computer system refreshes the screen within one second, then people perceive that it's fast.

So that was the goal for all the tabs of Facebook.

How do we make them fast, as in load within one second?

Samsung J five Prime, which is not the nicest device that around, but surprisingly, it's one of the most popular devices in the world.

So we started with 3.5 seconds for 75% off people loaded marketplace.

And when we heard about the goal, we thought, Well, it's a bit humorous.

A year bossed and turns out they believed in us and they were serious.

改善Facebook市場中的React Native性能--Konstantin Raev | 夏威夷JSConf 2019 (Improving React Native Performance in Facebook Marketplace  - Konstantin Raev | JSConf Hawaii 2019)

字幕列表影片播放

改善Facebook市場中的React Native性能--Konstantin Raev | 夏威夷JSConf 2019 (Improving React Native Performance in Facebook Marketplace - Konstantin Raev | JSConf Hawaii 2019)

engage

native

trick

experience