[wp-trac] [WordPress Trac] #63842: Emoji detection inline script introduces needless parser/render blocking

[WordPress Trac]

#63842: Emoji detection inline script introduces needless parser/render blocking
-------------------------------------+-------------------------------------
 Reporter:  westonruter              |       Owner:  westonruter
     Type:  enhancement              |      Status:  closed
 Priority:  normal                   |   Milestone:  6.9
Component:  Emoji                    |     Version:  4.6
 Severity:  normal                   |  Resolution:  fixed
 Keywords:  has-patch has-unit-      |     Focuses:  javascript,
  tests                              |  performance
-------------------------------------+-------------------------------------

Comment (by wildworks):

 I think this change caused errors related to script modules on Firefox.
 Based on my research, I believe this change also caused E2E tests related
 to navigation block to start failing in the Gutenberg project.

 See: https://github.com/WordPress/gutenberg/actions/workflows/end2end-
 test.yml

 Now that the emoji loader is loaded via a script module, the source code
 looks like this:

 {{{
 <script type="module">
 /**
  * @output wp-includes/js/wp-emoji-loader.js
  */
 ...
 </script>

 <script type="importmap" id="wp-importmap">
 {"imports":{"@wordpress/interactivity":"http://localhost:8889/wp-
 includes/js/dist/script-
 modules/interactivity/debug.js?ver=844167190aa4a0e411f0"}}
 </script>

 <script type="module" src="http://localhost:8889/wp-includes/js/dist
 /script-modules/block-library/navigation/view.js?ver=52594d8ac17824d31d5e"
 id="@wordpress/block-library/navigation/view-js-module"
 fetchpriority="low"></script>
 }}}


 As you can see, the import map is defined ''after'' the emoji loader.

 My understanding is that script modules are treated more strictly in
 Firefox than in Chrome, so running a script module before the import map
 will result in an error.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/63842#comment:21>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform