Facebook: How to make apps fit all systems, bandwidth, and screens

How do you improve if your mobile application can only run well in one region, such as us? On @scale Conference, Facebook has talked about the issue many times. So how to design a more suitable application for user needs, here we look to Facebook project manager Chris Marra's developing Android Apps for emerging harsh speech video review.

Video please visit the link above (YouTube)

On the mobile network, Chris says, because of regional differences, users have a huge difference in network connectivity. The 3G coverage for the USA is 70%, with an average latency of 280 milliseconds. In India, the 3G coverage is 6.9%, with a delay of 500 milliseconds. In Brazil, the 3G coverage is 38.6%, and the latency is more than 850 milliseconds.

At the same time, Facebook has done a comprehensive research on the devices that users use: Not all the devices are fast, not all devices are large, and not everyone is in a fast network. The results show that most of the equipment used by the user is about 2011 years of production, dual core and has more than 1GB of memory. At first, Facebook apps were designed only for high-end users, so the experience of those low-end device owners was very poor.

To meet the experience needs of these users, Facebook has built its own application--using lightweight animations for low-end devices and other strategies. For those with small-screen handsets, Facebook has designed apps that match different screen sizes.

At the moment, Facebook has become a product-centric architecture: Vertical teams are responsible for the corresponding products, rather than the unified, for example, an Android team responsible for all Android products. Of course, there is also a vertical team that is dedicated to improving the product experience across the Android platform and delving into the technical details of the platform.

Each team is responsible for terminal to terminal performance, and responsible for the reliability of the product. There is also a core team that focuses on, analyzes, and helps address performance issues.

Both the core team and the product team are essential. The core team is good at detecting and identifying problems and working with the product team to solve these problems. End-to-end control of the entire product is critical for mobile development, including core participation metrics (cores indicators metrics), core reliability, and core performance metrics (cores configured metrics), The core performance indicators include daily use, cold start time and reliability.

on how to address network performance bottlenecks, Facebook UB Manager published a speech titled Tuning Facebook for constrained NX. Andrew said that the solution to this problem is mainly from the following 3 aspects: Image Download sizes,network Quality detection,prefetching Content.

Video please visit the link above (YouTube)

Overall, on a Facebook scale, it's not easy to be exhaustive. User devices do not just cover Android and iOS in two areas, engineers must design for a variety of mobile phones.

Reduce picture size--jpeg reduce 30%,png by 80%

Most of the data downloaded from Facebook apps are images: 85% of total Android downloads, accounting for 65% of total data downloaded by Facebook Messenger. Therefore, reducing the size of the image can reduce the download time of the client, which is especially beneficial to the high latency network.

returns a picture of the appropriate size for the display layer

1. Compress the size on the server. Do not send large pictures to clients, and then let customers to compress. This wastes a lot of bandwidth and takes up more time.

2. Send a thumbnail (to describe the picture) and a preview picture (such as newsfeed), and then send the full volume after the user asks for access. And in most cases, the user's needs are just a thumbnail or a small picture.

3. As the screen becomes larger, the image scaling is not as efficient as it used to be, but it is still available, but the difference is just a different return.

Change the format of a picture

90% of Facebook and Messenger images sent to Android will be converted to WEBP format. The WEBP format was released by Google in 2010. Under the same quality WEBP saves the JPEG format 7% download volume. After quality and parameter tuning, the download volume of JPEG format 30% is saved without significant difference. WEBP also supports transparency and animation, a feature that is used in stickers products. On relatively old Android devices, pictures are transmitted through WEBP, and the client is converted to JPEG for rendering.

Network Quality detection--the relative adjustment of specific network

1. The same network (2G, 3G, LTE, WiFi, etc.), US network speed will be India and Brazil, two to three times times.

2. LTE is usually faster than WiFi, so you can't adjust it based on the speed of the transfer technology.

3. Add the following functionality to the client

measuring throughput of all large transmissions The Facebook server provides an round trip time (RTT) estimate in the HTTP header for each response. The client measures the average throughput and RTT time of the transmission to determine the quality of the corresponding network.

4. The quality of the connection is divided into the following groups: 150kbps "upgraded", 150-600kbps "moderate", "600-2000kbps" and "excellent" greater than 2000kbps.

5. Functional developers can adjust behavior according to the quality of the network.

6. Some adjustments based on quality problems:

Increase/decrease compression. Adjust the number of parallel network requests without consuming full bandwidth. Disable/allow automatic playback of video and do not cause more data transfer in slow networks. prefetch more content.

7. Facebook developed the air Traffic Control tool to support profile simulations for different traffic, and each profile can be set with parameters including bandwidth, packet loss, packet loss-correlation, delay , delay correlation, delay jitter.

prefetch content

Create a request and transfer before the content is really needed. Prefetch content is important in high latency, because the user gets a blank screen for a long wait. A request is established for feeds during application startup, so all data is ready when the feed is presented, and the process of downloading the data can occur in parallel with other initialization tasks. Save a priority queue for network requests, and do not affect data that is currently of interest to users because of background network requests blocking the foreground's network requests or data that the user does not see. Monitor excessive acquisition and excessive consumption of device resources. Excessive acquisition can deplete disk space or consume a significant amount of user traffic.

Foreground Parameters

Upload the

client to the server. The idea here is to upload as little data as possible to the server, which means resizing the picture before sending it to the server. If the upload retry fails quickly, it is usually due to a network problem. The Facebook app has about 20 different apk (Android application packages), based primarily on API levels, screen size, and processor architecture.

SOURCE Link: How Facebook makes Mobile Work at Scale to all Phones, on all Screens, on all NX (Compile/Zhonghao revisers/wei)

Free Subscription "CSDN cloud Computing (left) and csdn large data (right)" micro-letter public number, real-time grasp of first-hand cloud news, to understand the latest big data progress!

CSDN publishes related cloud computing information, such as virtualization, Docker, OpenStack, Cloudstack, and data centers, sharing Hadoop, Spark, Nosql/newsql, HBase, Impala, memory calculations, stream computing, Machine learning and intelligent algorithms and other related large data views, providing cloud computing and large data technology, platform, practice and industry information services.