Sunday, 12 May 2019

Capture full screenshot using Chrome DevTools


  • Open inspect element using Ctrl+Shft+I.
  • Toggle device toolbar using Ctrl+Shft+M to enter responsive mode and Select the screen size and set zoom level to 100%.
  • Refresh the page so that layout takes it's place using Ctrl+Shft+R.
  • Press Ctrl+Shft+P and enter "screenshot" in textbox and select the "Capture full size screenshot"
  • File will be downloaded.

Tuesday, 12 March 2019

PageSpeed Insights

1. First Contentful Paint

First Contentful Paint marks the time at which the first text or image is painted.

Ref: https://developers.google.com/web/tools/lighthouse/audits/first-contentful-paint

2. First Meaningful Paint

First Meaningful Paint measures when the primary content of a page is visible.

Ref: https://developers.google.com/web/tools/lighthouse/audits/first-meaningful-paint

3. Speed Index

Speed Index shows how quickly the contents of a page are visibly populated.

Ref: https://developers.google.com/web/tools/lighthouse/audits/speed-index

4. Time to Interactive

Time to Interactive is the amount of time in which it takes for the content on your page to become functional and ready for the user to interact with once the content has stabilized.

Ref: https://developers.google.com/web/tools/lighthouse/audits/time-to-interactive

5. First CPU Idle

First CPU Idle marks the first time at which the page's main thread is quiet enough to handle input.

Ref: https://developers.google.com/web/tools/lighthouse/audits/first-cpu-idle

6. First Input Delay (FID) 

First Input Delay (FID) is a metric that tracks the delay between the time a user can attempt to interact with a part of the site, and the time that the interface is able to respond to that interaction