This article is part of my personal wiki where I write personal notes while I am learning new technologies. You are welcome to use it for your own learning!

A Way To Measure Performane with the RAIL model

The RAIL model is a user-centric way to measure the performance of your websites. It is based on how users perceive your application delays:

• People are great at tracking motion and dislike when animations aren’t smooth. Smooth animations require the famous 60 frames per second which leaves 16ms to render a frame (6ms for the browser to paint the new frame on the screen, 10ms for your app to produce the frame)
• The attention span of a user is limited. Under 100ms he user will perceive something as being immediate, any longer and the user will be able to perceive a delay. 100-300ms and the user will perceive a small delay. 300-1000ms and things will still feel part of continuum. Beyond 1 second a user will lose focus and beyond 10 seconds the user gets frustrated and is likely to abandon the task at hand, your web app and never come back (:D).

RAIL focuses on 4 points of interaction between a user and your app:

• Response: Respond in under 100ms
• Animation: Produce a frame in 10ms
• Idle: Maximize idel time
• Load: Deliver content in under 1000ms

Response: respond in under 100ms

The analysis on user perception reveals that you need to respond to use input in under 100 ms before they notice a lag. This applies to most points of interaction between a user and your web app: clicking a button, checkbox, form input, triggering an animation, etc. For actions that take longer to complete, you’ll need to provide some sort of immediate feedback to the user so he/she knows that his request is being processed.

Animation: produce a frame in 10ms

Idle: maximize idle time

Load: deliver content under 1000ms

References

• Google Developers on Web Performance