{"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\"> &lt; 1<\/span> <span class=\"rt-label rt-postfix\">minute read<\/span><\/span><p class=\"lead\"><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.<\/p>\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\"> &lt; 1<\/span> <span class=\"rt-label rt-postfix\">minute read<\/span><\/span>Time to First Meaningful Paint (TTFMT) 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. Rendering some background color can be much easier and faster, but that&#8217;s definitely not what the&#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":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[279,15,48],"tags":[282],"class_list":["post-1423","post","type-post","status-publish","format-standard","hentry","category-modern-performance-metrics","category-page-load-time","category-test-automation","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: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}]}}