{"id":1423,"date":"2019-02-06T13:17:27","date_gmt":"2019-02-06T13:17:27","guid":{"rendered":"https:\/\/loadfocus.com\/blog\/?p=1423"},"modified":"2023-09-12T16:45:56","modified_gmt":"2023-09-12T16:45:56","slug":"what-is-first-meaningful-paint-fmp","status":"publish","type":"post","link":"https:\/\/loadfocus.com\/blog\/2019\/02\/what-is-first-meaningful-paint-fmp","title":{"rendered":"What is First Meaningful Paint (FMP)?"},"content":{"rendered":"<span class=\"span-reading-time rt-reading-time\" style=\"display: block;\"><span class=\"rt-label rt-prefix\"><\/span> <span class=\"rt-time\"> 2<\/span> <span class=\"rt-label rt-postfix\">minutes read<\/span><\/span><p class=\"lead\"><!-- pn-tldr --><\/p>\n<h2>Key takeaways<\/h2>\n<ul>\n<li>FMP tried to capture when the main content appeared, rather than the first pixel.<\/li>\n<li>It proved hard to measure consistently and has largely been replaced by LCP.<\/li>\n<li>Use LCP for anything current; FMP appears mainly in older reports.<\/li>\n<\/ul>\n<p><!-- \/pn-tldr --><strong>Time to First Meaningful Paint (TTFMT)<\/strong> is a modern performance metric introduced by few engineers from Google, and is the time to paint the main content that users are interested in, so the thing the users came here for.<\/p>\n<p>Rendering some background color can be much easier and faster, but that&#8217;s definitely not what the users was looking for when they entered your website.<\/p>\n<p>In order to identify the main content of the page, we define these primary elements as Hero Elements, but for now there is not a clear way for us to get paint times of specific elements of the DOM (Document Object Model).<\/p>\n<a href=\"https:\/\/kissfront.com\" class=\"broken_link\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-medium\" src=\"https:\/\/d2woeiihr4s5r6.cloudfront.net\/kissfront\/blog\/kissfront-first-contentful-paint-1.png\" alt=\"first meaningful paint\" width=\"800\" height=\"600\" \/><\/a>\n<p>No browsers exposes this metric at the moment, but it seems to get big traction. You can inspect the <a href=\"https:\/\/loadfocus.com\/blog\/2019\/01\/31\/what-is-first-contentful-paint\/\">First Contentful Paint (FCP)<\/a> and First Meaningful Paint (FMP) with <a href=\"https:\/\/loadfocus.com\">LoadFocus<\/a>, which allows easy monitoring and modern metrics inspection.<\/p>\n<p><strong>First Meaningful Paint<\/strong> can be also defined as the paint after which the biggest layout change has happened.<!-- pn-faq --><\/p>\n<h2>Frequently Asked Questions<\/h2>\n<h3>What was First Meaningful Paint?<\/h3>\n<p>An attempt to capture when the main content appeared, rather than the first pixel of anything. The intent was to measure when the page became useful.<\/p>\n<h3>Why is it no longer used?<\/h3>\n<p>It proved hard to measure consistently, since deciding which paint was the meaningful one is not straightforward. Largest Contentful Paint replaced it.<\/p>\n<h3>What should I use instead?<\/h3>\n<p>LCP for anything current. FMP still turns up in older reports and tooling, so it is worth recognising, but it is not the metric to optimise against today.<\/p>\n<p><!-- \/pn-faq --><!-- pn-related-reading --><\/p>\n<h2>Related reading<\/h2>\n<ul>\n<li><a href=\"https:\/\/loadfocus.com\/blog\/2019\/01\/what-is-first-contentful-paint\">What is First Contentful Paint?<\/a><\/li>\n<li><a href=\"https:\/\/loadfocus.com\/blog\/2019\/02\/what-is-first-paint-fp-in-modern-performance-metrics\">What is First Paint (FP) in Modern Performance Metrics?<\/a><\/li>\n<li><a href=\"https:\/\/loadfocus.com\/blog\/2019\/03\/chrome-extension-for-google-lighthouse-as-a-service\">Chrome Extension for Google Lighthouse as a service<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p><span class=\"span-reading-time rt-reading-time\" style=\"display: block;\"><span class=\"rt-label rt-prefix\"><\/span> <span class=\"rt-time\"> 2<\/span> <span class=\"rt-label rt-postfix\">minutes read<\/span><\/span>Key takeaways FMP tried to capture when the main content appeared, rather than the first pixel. It proved hard to measure consistently and has largely been replaced by LCP. Use LCP for anything current; FMP appears mainly in older reports. Time to First Meaningful Paint (TTFMT) is a modern performance metric introduced by few engineers&#8230;  <a href=\"https:\/\/loadfocus.com\/blog\/2019\/02\/what-is-first-meaningful-paint-fmp\" class=\"more-link\" title=\"Read What is First Meaningful Paint (FMP)?\">Read more &raquo;<\/a><\/p>\n","protected":false},"author":1,"featured_media":3742,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[48,104],"tags":[282],"class_list":["post-1423","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-test-automation","category-website-speed-testing","tag-first-meaningful-paint-vs-first-contentful-pain"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/loadfocus.com\/blog\/wp-json\/wp\/v2\/posts\/1423","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/loadfocus.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/loadfocus.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/loadfocus.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/loadfocus.com\/blog\/wp-json\/wp\/v2\/comments?post=1423"}],"version-history":[{"count":1,"href":"https:\/\/loadfocus.com\/blog\/wp-json\/wp\/v2\/posts\/1423\/revisions"}],"predecessor-version":[{"id":2818,"href":"https:\/\/loadfocus.com\/blog\/wp-json\/wp\/v2\/posts\/1423\/revisions\/2818"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/loadfocus.com\/blog\/wp-json\/wp\/v2\/media\/3742"}],"wp:attachment":[{"href":"https:\/\/loadfocus.com\/blog\/wp-json\/wp\/v2\/media?parent=1423"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/loadfocus.com\/blog\/wp-json\/wp\/v2\/categories?post=1423"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/loadfocus.com\/blog\/wp-json\/wp\/v2\/tags?post=1423"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}