array( 'render-blocking-resources' => array( 'instructions' => '
' . wp_kses(
sprintf(
// translators: 1 W3TC plugin name, 2 HTML a tag to W3TC Minify JS admin page
// translators: 3 HTML a tag to W3TC general settings user experience section
// translators: 4 HTML a tag to W3TC user expereince advanced settings page
// translators: 5 HTML a tag to W3TC Minify CSS admin page, 6 HTML line break tag.
esc_html__(
'%1$s can eliminate render blocking resources.%6$sOnce Minified, you can defer JS in the
%2$s.%6$sThe Defer Scripts (PRO FEATURE) can also be used with or without Minify to defer
the loading of JS files containing the "src" attribute. Scripts matched using this
feature will be excluded from the Minify process. To enable this feature navigate
to %3$s and check the "Defer JavaScript" checkbox. Once enabled the settings can be found
at %4$s.%6$sRender blocking CSS can be eliminated in %5$s using the "Eliminate Render
blocking CSS by moving it to HTTP body" (PRO FEATURE).',
'w3-total-cache'
),
'W3 Total Cache',
'' . esc_html__( 'Performance » Minify » JS', 'w3-total-cache' ) . ' ',
'' . esc_html__( 'Performance » General Settings » User Experience', 'w3-total-cache' ) . '',
'' . esc_html__( 'Performance » User Experience', 'w3-total-cache' ) . '',
'' . esc_html__( 'Performance » Minify » CSS', 'w3-total-cache' ) . '',
'
'
),
$allowed_tags
) . '
' . esc_html__( 'Some themes and plugins are loading CSS files or parts of the CSS files on all pages and not only on the pages that should be loading on. For eaxmple if you are using some contact form plugin, there is a chance that the CSS file of that plugin will load not only on the /contact/ page, but on all other pages as well and this is why the unused CSS should be removed.', 'w3-total-cache' ) . '
' . esc_html__( 'Open your Chrome browser, go to “Developer Tools”, click on “More Tools” and then “Coverage”.', 'w3-total-cache' ) . '
' . esc_html__( 'Coverage will open up. We will see buttons for start capturing coverage, to reload and start capturing coverage and to stop capturing coverage and show results.', 'w3-total-cache' ) . '
' . esc_html__( 'If you have a webpage you want to analyze its code coverage. Load the webpage and click on the o button in the Coverage tab.', 'w3-total-cache' ) . '
' . esc_html__( 'After sometime, a table will show up in the tab with the resources it analyzed, and how much code is used in the webpage. All the files linked in the webpage (css, js) will be listed in the Coverage tab. Clicking on any resource there will open that resource in the Sources panel with a breakdown of Total Bytes and Unused Bytes.', 'w3-total-cache' ) . '
' . esc_html__( 'With this breakdown, we can see how many unused bytes are in our CSS files, so we can manually remove them.', 'w3-total-cache' ) . '
', ), 'unminified-css' => array( 'instructions' => '' . wp_kses( sprintf( // translators: 1 HTML a tag to W3TC Minify CSS admin page, 2 HTML acronym for CSS, 3 HTML acronym for JS, 4 HTML a tag to W3 API FAQ page containing HTML acronym tag for FAQ. esc_html__( 'On the %1$s tab all of the recommended settings are preset. Use the help button to simplify discovery of your %2$s and %3$s files and groups. Pay close attention to the method and location of your %3$s group embeddings. See the plugin\'s %4$s for more information on usage.', 'w3-total-cache' ), '' . esc_html__( 'Minify', 'w3-total-cache' ) . '', '' . esc_html__( 'CSS', 'w3-total-cache' ) . '', '' . esc_html__( 'JS', 'w3-total-cache' ) . '', '' . esc_html__( 'FAQ', 'w3-total-cache' ) . '' ), $allowed_tags ) . '
', ), 'unminified-javascript' => array( 'instructions' => '' . wp_kses( sprintf( // translators: 1 HTML a tag to W3TC Minify CSS admin page, 2 HTML acronym for CSS, 3 HTML acronym for JS, 4 HTML a tag to W3 API FAQ page containing HTML acronym tag for FAQ. esc_html__( 'On the %1$s tab all of the recommended settings are preset. Use the help button to simplify discovery of your %2$s and %3$s files and groups. Pay close attention to the method and location of your %3$s group embeddings. See the plugin\'s %4$s for more information on usage.', 'w3-total-cache' ), '' . esc_html__( 'Minify', 'w3-total-cache' ) . '', '' . esc_html__( 'CSS', 'w3-total-cache' ) . '', '' . esc_html__( 'JS', 'w3-total-cache' ) . '', '' . esc_html__( 'FAQ', 'w3-total-cache' ) . '' ), $allowed_tags ) . '
', ), 'unused-javascript' => array( 'instructions' => '' . esc_html__( 'Some themes and plugins are loading JS files or parts of the JS files on all pages and not only on the pages that should be loading on. For eaxmple if you are using some contact form plugin, there is a chance that the JS file of that plugin will load not only on the /contact/ page, but on all other pages as well and this is why the unused JS should be removed.', 'w3-total-cache' ) . '
' . esc_html__( 'Open your Chrome browser, go to “Developer Tools”, click on “More Tools” and then “Coverage”.', 'w3-total-cache' ) . '
' . esc_html__( 'Coverage will open up. We will see buttons for start capturing coverage, to reload and start capturing coverage and to stop capturing coverage and show results.', 'w3-total-cache' ) . '
' . esc_html__( 'If you have a webpage you want to analyze its code coverage. Load the webpage and click on the o button in the Coverage tab.', 'w3-total-cache' ) . '
' . esc_html__( 'After sometime, a table will show up in the tab with the resources it analyzed, and how much code is used in the webpage. All the files linked in the webpage (css, js) will be listed in the Coverage tab. Clicking on any resource there will open that resource in the Sources panel with a breakdown of Total Bytes and Unused Bytes.', 'w3-total-cache' ) . '
' . esc_html__( 'With this breakdown, we can see how many unused bytes are in our JS files, so we can manually remove them.', 'w3-total-cache' ) . '
', ), 'uses-responsive-images' => array( 'instructions' => '' . wp_kses( sprintf( // translators: 1 HTML a tag to helpx.adobe.com for optimizing-image-jped-format. esc_html__( 'It\'s important to prepare images before uloading them to the website. This should be done before the Image is uploaded and can be done by using some image optimization tool like %1$s.', 'w3-total-cache' ), '' . esc_html__( 'photoshop', 'w3-total-cache' ) . '' ), $allowed_tags ) . '
' . esc_html__( 'Using srcset:', 'w3-total-cache' ) . '
' . esc_html__( 'The srcset HTML tag provides the browser with variations of an image (including a fallback image) and instructs the browser to use specific images depending on the situation.', 'w3-total-cache' ) . '
' . esc_html__( 'Essentially, you create various sizes of your image, and then utilize the srcset tag to define when the images get served. This is useful for responsive design when you have multiple images to deliver across several devices and dimensions.', 'w3-total-cache' ) . '
' . esc_html__( 'For example, let\'s say you want to send a high-resolution image to only those users that have high-resolution screens, as determined by the Device pixel ratio (DPR). The code would look like this:', 'w3-total-cache' ) . '
' . esc_html( '' ) . '
' . esc_html__( 'Use image optimization plugin.', 'w3-total-cache' ) . '
', ), 'offscreen-images' => array( 'instructions' => '' . esc_html__( 'Enable lazy load for images.', 'w3-total-cache' ) . '
', ), 'uses-optimized-images' => array( 'instructions' => '' . sprintf( // translators: 1 W3TC plugin name, opening HTML a tag to Image Service extension, 3 closing HTML a tag. esc_html__( 'Use %1$s %2$sWebP Converter%3$s to convert media library images to WebP.', 'w3-total-cache' ), 'W3 Total Cache', '', '' ) . '
', ), 'modern-image-formats' => array( 'instructions' => '' . sprintf( // translators: 1 W3TC plugin name, opening HTML a tag to Image Service extension, 3 closing HTML a tag. esc_html__( 'Use %1$s %2$sWebP Converter%3$s to convert media library images to WebP.', 'w3-total-cache' ), 'W3 Total Cache', '', '' ) . '
', ), 'uses-text-compression' => array( 'instructions' => '' . wp_kses( sprintf( // translators: 1 W3TC plugin name, 2 HTML a tag to kjdev php-ext-brotli. esc_html__( 'Use %1$s Browser Caching - Peformance>Browser Cache - Enable Gzip compression or Brotli compression (Gzip compression is most common and for Brotli compression you need to install %2$s on your server.', 'w3-total-cache' ), 'W3 Total Cache', '' . esc_html__( 'Brotli extension', 'w3-total-cache' ) . '' ), $allowed_tags ) . '
', ), 'uses-rel-preconnect' => array( 'instructions' => '' . esc_html__( 'Look at the list of third-party resources flagged by Google Page speed and add preconnect or dns-prefetch to their link tags depending on whether the resource is critical or not.', 'w3-total-cache' ) . '
' . esc_html( '' ) . '
' . esc_html__( 'Where "https://third-party-example.com" is the critical third-party domain your page intends to connect to.', 'w3-total-cache' ) . '
' . esc_html( '' ) . '
' . esc_html__( 'Where "https://third-party-example.com" is the domain of the respective third-party resource.', 'w3-total-cache' ) . '
' . sprintf( // translators: 1 W3TC plugin name, 2 opening HTML a tag to Page Cache setting, 3 closing HTML a tag. esc_html__( 'Use %1$s %2$sPage Caching%3$s (fastest module)', 'w3-total-cache' ), 'W3 Total Cache', '', '' ) . '
', ), 'redirects' => array( 'instructions' => '' . esc_html__( 'When dealing with server-side redirects, we recommend that they be executed via web server configuration as they are often faster than application-level configuration.', 'w3-total-cache' ) . '
' . esc_html__( 'Avoid client-side redirects, as much as possible, as they are slower, non-cacheable and may not be supported by browsers by default.', 'w3-total-cache' ) . '
' . esc_html__( 'Wherever possible, avoid landing page redirects; especially, the practice of executing separate, individual redirects for reasons such as protocol change, adding www, mobile-specific page, geo-location, and subdomain.', 'w3-total-cache' ) . '
' . esc_html__( 'Always redirect to the preferred version of the URL, especially, when redirects are dynamically generated. This helps eliminate unnecessary redirects.', 'w3-total-cache' ) . '
' . esc_html__( 'Similarly, remove temporary redirects if not needed anymore.', 'w3-total-cache' ) . '
' . esc_html__( 'Remember that combining multiple redirects into a single redirect is the most effective way to improve web performance.', 'w3-total-cache' ) . '
', ), 'uses-rel-preload' => array( 'instructions' => '' . sprintf( // translators: 1 W3TC plugin name. esc_html__( 'JS and CSS - Use HTTP2/Push for %1$s Minified files', 'w3-total-cache' ), 'W3 Total Cache' ) . '
' . esc_html__( 'Preload fonts hosted on the server: ', 'w3-total-cache' ) . '' . esc_html( '' ) . '
' . sprintf( // translators: 1 W3TC plugin name, opening HTML a tag to Image Service extension, 3 closing HTML a tag. esc_html__( 'Use %1$s %2$sWebP Converter%3$s to convert media library images to WebP.', 'w3-total-cache' ), 'W3 Total Cache', '', '' ) . '
', ), 'duplicated-javascript' => array( 'instructions' => '' . esc_html__( 'Incorporate good site building practices into your development workflow to ensure you avoid duplication of JavaScript modules in the first place.', 'w3-total-cache' ) . '
' . wp_kses( sprintf( // translators: 1 HTML a tag to Zillow Webpack-Stats-Duplicates. esc_html__( 'To fix this audit, use a tool like %1$s to identify duplicate modules', 'w3-total-cache' ), '' . esc_html__( 'webpack-stats-duplicates', 'w3-total-cache' ) . '' ), $allowed_tags ) . '
', ), 'legacy-javascript' => array( 'instructions' => '' . esc_html__( 'One way to deal with this issue is to load polyfills, only when needed, which can provide feature-detection support at JavaScript runtime. However, it is often very difficult to implement in practice.', 'w3-total-cache' ) . '
' . esc_html__( 'Implement modern feature-detection using ', 'w3-total-cache' ) . '' . esc_html( '