{"id":3448,"date":"2024-12-06T22:28:50","date_gmt":"2024-12-06T22:28:50","guid":{"rendered":"https:\/\/www.wpconsults.com\/?p=3448"},"modified":"2024-12-06T22:28:51","modified_gmt":"2024-12-06T22:28:51","slug":"litespeed-cache-esi-settings-explained","status":"publish","type":"post","link":"https:\/\/www.wpconsults.com\/fr\/litespeed-cache-esi-settings-explained\/","title":{"rendered":"Explication des param\u00e8tres de LiteSpeed Cache ESI"},"content":{"rendered":"\n<p>Edge Side Includes (ESI) is a powerful feature that helps websites improve their caching strategies, especially for dynamic content. By enabling ESI, <strong>you can serve cached pages even for logged-in users while maintaining dynamic functionality. <\/strong><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>What is ESI?<\/strong><\/h2>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe title=\"What is Edge Side Includes (ESI)?\" width=\"720\" height=\"405\" src=\"https:\/\/www.youtube.com\/embed\/uYpR6D8n3oE?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p><strong>ESI allows developers to split a webpage into dynamic and static fragments. While static fragments can be cached and served quickly, dynamic fragments can be updated or personalized without reloading the entire page. <\/strong><\/p>\n\n\n\n<p>This technique essentially creates \u201choles\u201d in the static content, which are later filled with dynamic data, enabling efficient content delivery without compromising functionality.<\/p>\n\n\n\n<p><strong>For instance:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Static Content<\/strong>: Can be cached and reused across all visitors.<\/li>\n\n\n\n<li><strong>Dynamic Content<\/strong>: Personalized elements like user-specific data, forms, or admin panels.<\/li>\n<\/ul>\n\n\n\n<p>ESI ensures that these fragments are served efficiently, enhancing the overall page load speed and reducing server resource usage.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Why ESI<\/strong> is Important Element in Caching<\/h2>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>Improved Performance for Logged-in Users<\/strong>: ESI makes it possible to serve cached pages for logged-in users by separating dynamic and static content.<\/li>\n\n\n\n<li><strong>Better Cache Utilization<\/strong>: By caching public and private fragments independently, ESI maximizes caching potential.<\/li>\n\n\n\n<li><strong>Flexibility with Content TTL (Time-to-Live)<\/strong>: ESI allows developers to set different TTLs for various page components, ensuring timely updates for dynamic data.<\/li>\n\n\n\n<li><strong>Reduced Server Load<\/strong>: Static fragments are served directly from cache, minimizing server resource consumption.<\/li>\n<\/ol>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Exploring LiteSpeed Cache ESI Settings<\/strong><\/h2>\n\n\n\n<p><a href=\"https:\/\/wordpress.org\/plugins\/litespeed-cache\/\" rel=\"nofollow noopener\" target=\"_blank\">LiteSpeed Cache<\/a> makes it easier to implement ESI with a simple interface. Here\u2019s a breakdown of the ESI settings:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large has-custom-border\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"706\" src=\"https:\/\/www.wpconsults.com\/wp-content\/uploads\/2024\/12\/image-4-1024x706.avif\" alt=\"\" class=\"has-border-color has-theme-palette-2-border-color wp-image-3449\" style=\"border-width:2px\" srcset=\"https:\/\/www.wpconsults.com\/wp-content\/uploads\/2024\/12\/image-4-1024x706.avif 1024w, https:\/\/www.wpconsults.com\/wp-content\/uploads\/2024\/12\/image-4-300x207.avif 300w, https:\/\/www.wpconsults.com\/wp-content\/uploads\/2024\/12\/image-4-768x530.avif 768w, https:\/\/www.wpconsults.com\/wp-content\/uploads\/2024\/12\/image-4-png.avif 1164w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">1. <strong>Enable ESI<\/strong>:<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Option<\/strong>: Toggle ESI On or Off.<\/li>\n\n\n\n<li><strong>Function<\/strong>: When enabled, LiteSpeed can cache public pages for logged-in users. This setting is the cornerstone of ESI, ensuring personalized and static content are handled separately.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">2. <strong>Cache Admin Bar<\/strong>:<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Option<\/strong>: Enable or Disable.<\/li>\n\n\n\n<li><strong>Function<\/strong>: Caches the WordPress Admin Bar as an ESI block. When enabled, it prevents the Admin Bar from being dynamically loaded each time, improving performance for logged-in administrators.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">3. <strong>Cache Comment Form<\/strong>:<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Option<\/strong>: Enable or Disable.<\/li>\n\n\n\n<li><strong>Function<\/strong>: Caches the WordPress comment form as an ESI block. By enabling this, you reduce server load while ensuring the form remains functional for user interactions.<\/li>\n<\/ul>\n\n\n\n<ol class=\"wp-block-list\"><\/ol>\n\n\n\n<figure class=\"wp-block-image size-large has-custom-border\"><img decoding=\"async\" width=\"1024\" height=\"449\" src=\"https:\/\/www.wpconsults.com\/wp-content\/uploads\/2024\/12\/image-5-1024x449.avif\" alt=\"\" class=\"has-border-color has-theme-palette-2-border-color wp-image-3450\" style=\"border-width:2px\" srcset=\"https:\/\/www.wpconsults.com\/wp-content\/uploads\/2024\/12\/image-5-1024x449.avif 1024w, https:\/\/www.wpconsults.com\/wp-content\/uploads\/2024\/12\/image-5-300x132.avif 300w, https:\/\/www.wpconsults.com\/wp-content\/uploads\/2024\/12\/image-5-768x337.avif 768w, https:\/\/www.wpconsults.com\/wp-content\/uploads\/2024\/12\/image-5-1536x674.avif 1536w, https:\/\/www.wpconsults.com\/wp-content\/uploads\/2024\/12\/image-5-png.avif 1602w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">4. <strong>ESI Nonces<\/strong><\/h3>\n\n\n\n<p><strong>What are ESI Nonces?<\/strong> Nonces are unique tokens used in WordPress to secure URLs and forms. They ensure that actions or forms on your website cannot be abused by unauthorized users. LiteSpeed Cache enables you to manage these nonces using ESI, converting them into ESI blocks automatically.<\/p>\n\n\n\n<p><strong>Configuration in LiteSpeed:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Field<\/strong>: Add nonce names (e.g., <code>stats_nonce<\/code>, <code>subscribe_nonce<\/code>) one per line.<\/li>\n\n\n\n<li><strong>Optional Parameters<\/strong>: Specify caching rules with additional parameters:\n<ul class=\"wp-block-list\">\n<li>Example: <code>my_nonce_action private<\/code><\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><strong>Wildcard Support<\/strong>: Use wildcards (<code>*<\/code>) to match multiple nonces, such as <code>nonce_formid_*<\/code>.<\/li>\n<\/ul>\n\n\n\n<p><strong>How It Works:<\/strong> By declaring these nonces in the ESI settings, LiteSpeed handles them as separate fragments, ensuring secure and dynamic interaction with cached pages.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">5. <strong>Vary Group<\/strong><\/h3>\n\n\n\n<p><strong>What is Vary Group?<\/strong> The Vary Group setting allows you to control cache variations based on user roles. This is useful for scenarios where certain roles, like administrators, need to see tailored content (e.g., an edit link on pages) while other users see the default cached content.<\/p>\n\n\n\n<p><strong>Settings Breakdown:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Each user role (e.g., Administrator, Author, Customer) can be assigned a group ID.<\/li>\n\n\n\n<li>Assign <strong>99<\/strong> to a role (such as Administrator) to create a separate cache version for that group.<\/li>\n\n\n\n<li>Other roles with a group ID of <strong>0<\/strong> will share the default public cache.<\/li>\n<\/ul>\n\n\n\n<p><strong>Practical Use Cases:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Administrators<\/strong>: Allow separate caching for administrators to include dynamic elements like dashboard links or admin-specific options.<\/li>\n\n\n\n<li><strong>Subscribers\/Customers<\/strong>: Retain default caching for regular users or customers who access static content.<\/li>\n<\/ul>\n\n\n\n<p><strong>Benefits:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Prevents cache contamination between user roles.<\/li>\n\n\n\n<li>Ensures accurate display of role-specific dynamic content.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>How These Features Enhance Performance<\/strong><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>ESI Nonces<\/strong>: Securely integrate dynamic user actions within cached pages without compromising page speed.<\/li>\n\n\n\n<li><strong>Vary Group<\/strong>: Optimizes cache utilization by delivering the right content to the right audience, improving both user experience and backend efficiency.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>How to Use ESI in LiteSpeed Cache?<\/strong><\/h2>\n\n\n\n<p>Using ESI requires designating parts of a page as ESI blocks. For instance, replace your shortcode <code><strong><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-theme-palette-2-color\">[shortcodeA attr1=\"val1\" attr2=\"val2\"]<\/mark><\/strong><\/code> with <code><strong><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-theme-palette-2-color\">[esi shortcodeA attr1=\"val1\" attr2=\"val2\"]<\/mark><\/strong><\/code>. This tells LiteSpeed to treat this fragment dynamically.<\/p>\n\n\n\n<p>For developers, <a href=\"https:\/\/www.litespeedtech.com\/products\/cache-plugins\/wordpress-acceleration\" rel=\"nofollow noopener\" target=\"_blank\">LiteSpeed <\/a>also offers sample codes and tutorials to help implement ESI efficiently.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Results of Using ESI<\/strong><\/h2>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>Faster Page Loads<\/strong>: Static content loads instantly, while dynamic content is fetched only when needed.<\/li>\n\n\n\n<li><strong>Improved User Experience<\/strong>: By maintaining fast speeds for logged-in users, ESI ensures smooth interactions with your website.<\/li>\n\n\n\n<li><strong>Cost Savings<\/strong>: Reduced server resource usage translates to lower hosting costs.<\/li>\n<\/ol>\n\n\n\n<p>ESI is a game-changer for websites that cater to both logged-in and guest users. With LiteSpeed Cache\u2019s intuitive ESI settings, you can boost your website\u2019s speed, enhance user experience, and optimize resource usage effectively. Implement ESI today to see the difference in your website\u2019s performance!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Edge Side Includes (ESI) est une fonctionnalit\u00e9 puissante qui aide les sites web \u00e0 am\u00e9liorer leurs strat\u00e9gies de mise en cache, en particulier pour le contenu dynamique. En activant l'ESI, vous pouvez servir des pages mises en cache m\u00eame aux utilisateurs connect\u00e9s, tout en conservant les fonctionnalit\u00e9s dynamiques. Qu'est-ce que l'ESI ? L'ESI permet aux d\u00e9veloppeurs de diviser une page web en fragments dynamiques et statiques. Les fragments statiques peuvent \u00eatre...<\/p>","protected":false},"author":1,"featured_media":3246,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_sitemap_exclude":false,"_sitemap_priority":"","_sitemap_frequency":"","_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[46],"tags":[],"class_list":["post-3448","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-performance"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/www.wpconsults.com\/wp-content\/uploads\/2024\/05\/WpConsults-Default-post-thumbnail-jpg.webp?fit=1280%2C720&ssl=1","jetpack_sharing_enabled":true,"jetpack_likes_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/pboFy3-TC","jetpack-related-posts":[],"_links":{"self":[{"href":"https:\/\/www.wpconsults.com\/fr\/wp-json\/wp\/v2\/posts\/3448","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wpconsults.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wpconsults.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wpconsults.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wpconsults.com\/fr\/wp-json\/wp\/v2\/comments?post=3448"}],"version-history":[{"count":0,"href":"https:\/\/www.wpconsults.com\/fr\/wp-json\/wp\/v2\/posts\/3448\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.wpconsults.com\/fr\/wp-json\/wp\/v2\/media\/3246"}],"wp:attachment":[{"href":"https:\/\/www.wpconsults.com\/fr\/wp-json\/wp\/v2\/media?parent=3448"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wpconsults.com\/fr\/wp-json\/wp\/v2\/categories?post=3448"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wpconsults.com\/fr\/wp-json\/wp\/v2\/tags?post=3448"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}