Add Total Blocking Time documentation for Lighthouse

[kaycebasques]

Fixes #1627

Changes proposed in this pull request:

• Adds /src/site/content/en/lighthouse-performance/total-blocking-time/index.md

Staged page: https://deploy-preview-1636--web-dev-staging.netlify.com/total-blocking-time/

[netlify]

Deploy preview for web-dev-staging ready!

Built with commit eb0dbb7

https://deploy-preview-1636--web-dev-staging.netlify.com

[kaycebasques]

Hello @patrickhulce and @deepanjanroy,

I wrote documentation for Total Blocking Time. This will be the page that the Lighthouse report UI links to. Please provide a technical review of the content:

• Is the explanation of what TBT measures accurate?
• Is the scoring breakdown accurate?
• Is the guidance relevant?

[patrickhulce]

looks pretty good to me other than the minor technicality!

[kaycebasques]

@patrickhulce thank you for the speedy review, please go through your previous comments and resolve them if you think the updated content addresses your feedback

[patrickhulce]

My resolve comment button seems to be missing on this repo, but everything looks addressed to me!

[deepanjanroy]

lgtm!

[kaycebasques]

Thank you @patrickhulce and @deepanjanroy!

[robdodson]

LGTM.

I guess one thing to think about is how we want to handle all of these URLs when Phil does his metrics section because I imagine he'll also want to talk about Total Blocking Time.

[kaycebasques]

@robdodson good point. I renamed it to lighthouse-total-blocking-time. This is the pattern that you and I agreed to use for Largest Contentful Paint. In the long run I'd prefer to have lighthouse/total-blocking-time and use lighthouse/ for all the audit docs. It'll be tricky to redirect the existing Lighthouse docs, like /first-contentful-paint, to Phil's docs now that Lighthouse is linking to web.dev. We could use some other keyword for Phil's docs, e.g. total-blocking-time-guide.

[kaycebasques]

I reviewed this with a fresh pair of eyes. Since Rob also reviewed, as well as Patrick (who's usually pretty thorough even though he's only responsible for a technical review) the content should be fine, so I'm going to merge.

[robdodson]

@robdodson good point. I renamed it to lighthouse-total-blocking-time. This is the pattern that you and I agreed to use for Largest Contentful Paint. In the long run I'd prefer to have lighthouse/total-blocking-time and use lighthouse/ for all the audit docs. It'll be tricky to redirect the existing Lighthouse docs, like /first-contentful-paint, to Phil's docs now that Lighthouse is linking to web.dev. We could use some other keyword for Phil's docs, e.g. total-blocking-time-guide.

Another option would be to have Phil's guides use something like understanding-largest-contentful-paint.