Facebook hacks for performance optimization
I captured some of the challenges and solutions facebook engineers discuss:
1. Haste framework:
e.g. if you want to visit pictures page, the tagging library is not loaded. Its only ready. When someone clicks on tag, the tag library is loaded.
- user clicks on a link
- async request is sent and
- something in dom is updated.
Performance measurement tools: 45 minutes into the video they talk about performance measurement tools.
Another piece of marvel introduced by Facebook engineers is technology calle Bigpiper
Bigpipe: Progressively loading pages. Renders the head progressively and not only the head, but other parts of the page as well. pagelet: little pieces of the page. Therefore different parts of the page is rendered in parallel.
Bigpipe works with Haste.
Bigpipe works by exploiting the parallelism between web server and browser, BigPipe first breaks web pages into multiple chunks called pagelets. BigPipe breaks the page generation process into several stages:
- Request parsing: web server parses and sanity checks the HTTP request.
- Data fetching: web server fetches data from storage tier.
- Markup generation: web server generates HTML markup for the response.
- Network transport: the response is transferred from web server to browser.
- CSS downloading: browser downloads CSS required by the page.
- DOM tree construction and CSS styling: browser constructs DOM tree of the document, and then applies CSS rules on it.
Enjoy reading and hacking.