Optimising Chrome Extensions: Part 1 - Beyond Redux, Post-Manifest v3

<!DOCTYPE html>     <html class="no-js" lang="en-US"> <head>  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="author" content="blogtaboola"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"> <meta name="theme-color" content="#009bc5" /> <meta name="msapplication-TileColor" content="#ffffff"> <meta name="msapplication-TileImage" content="https://blog.taboola.com/wp-content/themes/taboola-new/assets/images/favicon/ms-icon-144x144.png"> <meta name="google-site-verification" content="6HMSpm3CAekh6Wt58ZoQYP0GTtTr52LcNz94V7rp5XI" /> <meta name="category" content="Engineering">  <link rel="profile" href="https://gmpg.org/xfn/11"> <link rel="pingback" href="https://blog.taboola.com/xmlrpc.php"> <link rel="icon" type="image/png" href="https://blog.taboola.com/wp-content/themes/taboola-new/assets/images/favicon.png" /> <meta name='robots' content='index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1' />  <title>Optimising Chrome Extensions: Part 1 - Beyond Redux, Post-Manifest v3</title> <meta name="description" content="Discover the evolution of Chrome extension development beyond Redux in the age of Manifest v3. Explore challenges, alternatives, and efficient solutions for state management, caching, and messaging. Learn the benefits of streamlining architecture, empowering content scripts, and future-proofing development." /> <link rel="canonical" href="https://blog.taboola.com/optimising-chrome-extensions-part-1/" /> <meta property="og:locale" content="en_US" /> <meta property="og:type" content="article" /> <meta property="og:title" content="Optimising Chrome Extensions: Part 1 - Beyond Redux, Post-Manifest v3" /> <meta property="og:description" content="Discover the evolution of Chrome extension development beyond Redux in the age of Manifest v3. Explore challenges, alternatives, and efficient solutions for state management, caching, and messaging. Learn the benefits of streamlining architecture, empowering content scripts, and future-proofing development." /> <meta property="og:url" content="https://blog.taboola.com/optimising-chrome-extensions-part-1/" /> <meta property="og:site_name" content="Taboola Blog" /> <meta property="article:publisher" content="https://www.facebook.com/taboola/" /> <meta property="article:published_time" content="2023-12-08T13:00:18+00:00" /> <meta property="article:modified_time" content="2023-12-07T16:45:18+00:00" /> <meta property="og:image" content="https://blog.taboola.com/wp-content/uploads/2023/12/shutterstock_15539709089-scaled.jpg" /> <meta property="og:image:width" content="2048" /> <meta property="og:image:height" content="1366" /> <meta property="og:image:type" content="image/jpeg" /> <meta name="author" content="Eduardo Aparicio Cardenes" /> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:creator" content="@taboola" /> <meta name="twitter:site" content="@taboola" /> <meta name="twitter:label1" content="Written by" /> <meta name="twitter:data1" content="Eduardo Aparicio Cardenes" /> <meta name="twitter:label2" content="Est. reading time" /> <meta name="twitter:data2" content="8 minutes" />  <style id='co-authors-plus-coauthors-style-inline-css' type='text/css'> .wp-block-co-authors-plus-coauthors.is-layout-flow [class*=wp-block-co-authors-plus]{display:inline} </style> <style id='co-authors-plus-avatar-style-inline-css' type='text/css'> .wp-block-co-authors-plus-avatar :where(img){height:auto;max-width:100%;vertical-align:bottom}.wp-block-co-authors-plus-coauthors.is-layout-flow .wp-block-co-authors-plus-avatar :where(img){vertical-align:middle}.wp-block-co-authors-plus-avatar:is(.alignleft,.alignright){display:table}.wp-block-co-authors-plus-avatar.aligncenter{display:table;margin-inline:auto} </style> <style id='co-authors-plus-image-style-inline-css' type='text/css'> .wp-block-co-authors-plus-image{margin-bottom:0}.wp-block-co-authors-plus-image :where(img){height:auto;max-width:100%;vertical-align:bottom}.wp-block-co-authors-plus-coauthors.is-layout-flow .wp-block-co-authors-plus-image :where(img){vertical-align:middle}.wp-block-co-authors-plus-image:is(.alignfull,.alignwide) :where(img){width:100%}.wp-block-co-authors-plus-image:is(.alignleft,.alignright){display:table}.wp-block-co-authors-plus-image.aligncenter{display:table;margin-inline:auto} </style> <style id='classic-theme-styles-inline-css' type='text/css'> /*! This file is auto-generated */ .wp-block-button__link{color:#fff;background-color:#32373c;border-radius:9999px;box-shadow:none;text-decoration:none;padding:calc(.667em + 2px) calc(1.333em + 2px);font-size:1.125em}.wp-block-file__button{background:#32373c;color:#fff;text-decoration:none} </style> <style id='global-styles-inline-css' type='text/css'> :root{--wp--preset--aspect-ratio--square: 1;--wp--preset--aspect-ratio--4-3: 4/3;--wp--preset--aspect-ratio--3-4: 3/4;--wp--preset--aspect-ratio--3-2: 3/2;--wp--preset--aspect-ratio--2-3: 2/3;--wp--preset--aspect-ratio--16-9: 16/9;--wp--preset--aspect-ratio--9-16: 9/16;--wp--preset--color--black: #000000;--wp--preset--color--cyan-bluish-gray: #abb8c3;--wp--preset--color--white: #ffffff;--wp--preset--color--pale-pink: #f78da7;--wp--preset--color--vivid-red: #cf2e2e;--wp--preset--color--luminous-vivid-orange: #ff6900;--wp--preset--color--luminous-vivid-amber: #fcb900;--wp--preset--color--light-green-cyan: #7bdcb5;--wp--preset--color--vivid-green-cyan: #00d084;--wp--preset--color--pale-cyan-blue: #8ed1fc;--wp--preset--color--vivid-cyan-blue: #0693e3;--wp--preset--color--vivid-purple: #9b51e0;--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%);--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%);--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg,rgba(252,185,0,1) 0%,rgba(255,105,0,1) 100%);--wp--preset--gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg,rgba(255,105,0,1) 0%,rgb(207,46,46) 100%);--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg,rgb(238,238,238) 0%,rgb(169,184,195) 100%);--wp--preset--gradient--cool-to-warm-spectrum: linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%);--wp--preset--gradient--blush-light-purple: linear-gradient(135deg,rgb(255,206,236) 0%,rgb(152,150,240) 100%);--wp--preset--gradient--blush-bordeaux: linear-gradient(135deg,rgb(254,205,165) 0%,rgb(254,45,45) 50%,rgb(107,0,62) 100%);--wp--preset--gradient--luminous-dusk: linear-gradient(135deg,rgb(255,203,112) 0%,rgb(199,81,192) 50%,rgb(65,88,208) 100%);--wp--preset--gradient--pale-ocean: linear-gradient(135deg,rgb(255,245,203) 0%,rgb(182,227,212) 50%,rgb(51,167,181) 100%);--wp--preset--gradient--electric-grass: linear-gradient(135deg,rgb(202,248,128) 0%,rgb(113,206,126) 100%);--wp--preset--gradient--midnight: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);--wp--preset--font-size--small: 13px;--wp--preset--font-size--medium: 20px;--wp--preset--font-size--large: 36px;--wp--preset--font-size--x-large: 42px;--wp--preset--spacing--20: 0.44rem;--wp--preset--spacing--30: 0.67rem;--wp--preset--spacing--40: 1rem;--wp--preset--spacing--50: 1.5rem;--wp--preset--spacing--60: 2.25rem;--wp--preset--spacing--70: 3.38rem;--wp--preset--spacing--80: 5.06rem;--wp--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);--wp--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);--wp--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);--wp--preset--shadow--outlined: 6px 6px 0px -3px rgba(255, 255, 255, 1), 6px 6px rgba(0, 0, 0, 1);--wp--preset--shadow--crisp: 6px 6px 0px rgba(0, 0, 0, 1);}:where(.is-layout-flex){gap: 0.5em;}:where(.is-layout-grid){gap: 0.5em;}body .is-layout-flex{display: flex;}.is-layout-flex{flex-wrap: wrap;align-items: center;}.is-layout-flex > :is(*, div){margin: 0;}body .is-layout-grid{display: grid;}.is-layout-grid > :is(*, div){margin: 0;}:where(.wp-block-columns.is-layout-flex){gap: 2em;}:where(.wp-block-columns.is-layout-grid){gap: 2em;}:where(.wp-block-post-template.is-layout-flex){gap: 1.25em;}:where(.wp-block-post-template.is-layout-grid){gap: 1.25em;}.has-black-color{color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-color{color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-color{color: var(--wp--preset--color--white) !important;}.has-pale-pink-color{color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-color{color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-color{color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-color{color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-color{color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-color{color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-color{color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-color{color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-color{color: var(--wp--preset--color--vivid-purple) !important;}.has-black-background-color{background-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-background-color{background-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-background-color{background-color: var(--wp--preset--color--white) !important;}.has-pale-pink-background-color{background-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-background-color{background-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-background-color{background-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-background-color{background-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-background-color{background-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-background-color{background-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-background-color{background-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-background-color{background-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-background-color{background-color: var(--wp--preset--color--vivid-purple) !important;}.has-black-border-color{border-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-border-color{border-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-border-color{border-color: var(--wp--preset--color--white) !important;}.has-pale-pink-border-color{border-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-border-color{border-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-border-color{border-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-border-color{border-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-border-color{border-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-border-color{border-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-border-color{border-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-border-color{border-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-border-color{border-color: var(--wp--preset--color--vivid-purple) !important;}.has-vivid-cyan-blue-to-vivid-purple-gradient-background{background: var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple) !important;}.has-light-green-cyan-to-vivid-green-cyan-gradient-background{background: var(--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan) !important;}.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;}.has-luminous-vivid-orange-to-vivid-red-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-orange-to-vivid-red) !important;}.has-very-light-gray-to-cyan-bluish-gray-gradient-background{background: var(--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray) !important;}.has-cool-to-warm-spectrum-gradient-background{background: var(--wp--preset--gradient--cool-to-warm-spectrum) !important;}.has-blush-light-purple-gradient-background{background: var(--wp--preset--gradient--blush-light-purple) !important;}.has-blush-bordeaux-gradient-background{background: var(--wp--preset--gradient--blush-bordeaux) !important;}.has-luminous-dusk-gradient-background{background: var(--wp--preset--gradient--luminous-dusk) !important;}.has-pale-ocean-gradient-background{background: var(--wp--preset--gradient--pale-ocean) !important;}.has-electric-grass-gradient-background{background: var(--wp--preset--gradient--electric-grass) !important;}.has-midnight-gradient-background{background: var(--wp--preset--gradient--midnight) !important;}.has-small-font-size{font-size: var(--wp--preset--font-size--small) !important;}.has-medium-font-size{font-size: var(--wp--preset--font-size--medium) !important;}.has-large-font-size{font-size: var(--wp--preset--font-size--large) !important;}.has-x-large-font-size{font-size: var(--wp--preset--font-size--x-large) !important;} :where(.wp-block-post-template.is-layout-flex){gap: 1.25em;}:where(.wp-block-post-template.is-layout-grid){gap: 1.25em;} :where(.wp-block-columns.is-layout-flex){gap: 2em;}:where(.wp-block-columns.is-layout-grid){gap: 2em;} :root :where(.wp-block-pullquote){font-size: 1.5em;line-height: 1.6;} </style> <link rel='stylesheet' id='taboola-cache-manager-css' href='https://blog.taboola.com/wp-content/plugins/taboola-cache-manager/public/css/taboola-cache-manager-public.css?ver=1.3.2' type='text/css' media='all' /> <link rel="icon" href="https://blog.taboola.com/wp-content/uploads/2019/12/cropped-favicon-32x32.png" sizes="32x32" /> <link rel="icon" href="https://blog.taboola.com/wp-content/uploads/2019/12/cropped-favicon-192x192.png" sizes="192x192" /> <link rel="apple-touch-icon" href="https://blog.taboola.com/wp-content/uploads/2019/12/cropped-favicon-180x180.png" /> <meta name="msapplication-TileImage" content="https://blog.taboola.com/wp-content/uploads/2019/12/cropped-favicon-270x270.png" />  <link rel="preconnect" href="https://dev.visualwebsiteoptimizer.com" /> <script type='text/javascript' id='vwoCode'> window._vwo_code || (function() { var account_id = 750209, version = 2.0, settings_tolerance = 2000, hide_element = 'body', hide_element_style = 'opacity:0 !important;filter:alpha(opacity=0) !important;background:none !important', /* DO NOT EDIT BELOW THIS LINE */ f = false, w = window, d = document, v = d.querySelector('#vwoCode'), cK = '_vwo_' + account_id + '_settings', cc = {}; try { var c = JSON.parse(localStorage.getItem('_vwo_' + account_id + '_config')); cc = c && typeof c === 'object' ? c : {} } catch (e) {} var stT = cc.stT === 'session' ? w.sessionStorage : w.localStorage; code = { use_existing_jquery: function() { return typeof use_existing_jquery !== 'undefined' ? use_existing_jquery : undefined }, library_tolerance: function() { return typeof library_tolerance !== 'undefined' ? library_tolerance : undefined }, settings_tolerance: function() { return cc.sT || settings_tolerance }, hide_element_style: function() { return '{' + (cc.hES || hide_element_style) + '}' }, hide_element: function() { return typeof cc.hE === 'string' ? cc.hE : hide_element }, getVersion: function() { return version }, finish: function() { if (!f) { f = true; var e = d.getElementById('_vis_opt_path_hides'); if (e) e.parentNode.removeChild(e) } }, finished: function() { return f }, load: function(e) { var t = this.getSettings(), n = d.createElement('script'), i = this; if (t) { n.textContent = t; d.getElementsByTagName('head')[0].appendChild(n); if (!w.VWO || VWO.caE) { stT.removeItem(cK); i.load(e) } } else { n.fetchPriority = 'high'; n.src = e; n.type = 'text/javascript'; n.onerror = function() { _vwo_code.finish() }; d.getElementsByTagName('head')[0].appendChild(n) } }, getSettings: function() { try { var e = stT.getItem(cK); if (!e) { return } e = JSON.parse(e); if (Date.now() > e.e) { stT.removeItem(cK); return } return e.s } catch (e) { return } }, init: function() { if (d.URL.indexOf('__vwo_disable__') > -1) return; var e = this.settings_tolerance(); w._vwo_settings_timer = setTimeout(function() { _vwo_code.finish(); stT.removeItem(cK) }, e); var t = d.currentScript, n = d.createElement('style'), i = this.hide_element(), r = t && !t.async && i ? i + this.hide_element_style() : '', c = d.getElementsByTagName('head')[0]; n.setAttribute('id', '_vis_opt_path_hides'); v && n.setAttribute('nonce', v.nonce); n.setAttribute('type', 'text/css'); if (n.styleSheet) n.styleSheet.cssText = r; else n.appendChild(d.createTextNode(r)); c.appendChild(n); this.load('https://dev.visualwebsiteoptimizer.com/j.php?a=' + account_id + '&u=' + encodeURIComponent(d.URL) + '&vn=' + version) } }; w._vwo_code = code; code.init(); })(); </script>   <script> (function(w, d, s, l, i) { w[l] = w[l] || []; w[l].push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' }); var f = d.getElementsByTagName(s)[0], j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f); })(window, document, 'script', 'dataLayer', 'GTM-PC4JX7'); </script>  <script type="text/javascript"> window._taboola = window._taboola || []; _taboola.push({article:'auto'}); !function (e, f, u, i) { if (!document.getElementById(i)){ e.async = 1; e.src = u; e.id = i; f.parentNode.insertBefore(e, f); } }(document.createElement('script'), document.getElementsByTagName('script')[0], '//cdn.taboola.com/libtrc/taboola-blog/loader.js', 'tb_loader_script'); if(window.performance && typeof window.performance.mark == 'function') {window.performance.mark('tbl_ic');} </script> <style> label{display:inline-block;max-width:100%;margin-bottom:5px;font-weight:700}input[type=search]{box-sizing:border-box}input[type=radio]{margin:4px 0 0;line-height:normal}input[type=search]{-webkit-appearance:none}.btn{display:inline-block;padding:6px 12px;margin-bottom:0;font-size:14px;font-weight:400;line-height:1.42857143;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;background-image:none;border:1px solid transparent;border-radius:4px}.progress-bar{float:left;width:0;height:100%;font-size:12px;line-height:20px;color:#fff;text-align:center;background-color:#337ab7;box-shadow:inset 0 -1px 0 rgba(0,0,0,.15)}.container:after,.container:before,.row:after,.row:before{display:table;content:" "}.container:after,.row:after{clear:both}@-ms-viewport{width:100vw}html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}aside,header{display:block}a{background-color:transparent}h1{margin:.67em 0;font-size:2em}svg:not(:root){overflow:hidden}input{margin:0;font:inherit;color:inherit}input[type=submit]{-webkit-appearance:button}input::-moz-focus-inner{padding:0;border:0}input{line-height:normal}input[type=radio]{box-sizing:border-box;padding:0}input[type=search]{box-sizing:content-box;-webkit-appearance:textfield}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}*{box-sizing:border-box}:after,:before{box-sizing:border-box}html{font-size:10px}body{font-family:poppins,Helvetica,Arial,sans-serif;font-size:16px;line-height:1.5;color:#333;background-color:#fff}input{font-family:inherit;font-size:inherit;line-height:inherit}a{color:#337ab7;text-decoration:none}h1,h4{font-family:inherit;font-weight:500;line-height:1.1;color:inherit}h1{margin-top:20px;margin-bottom:10px}h4{margin-top:10px;margin-bottom:10px}h1{font-size:36px}h4{font-size:18px}p{margin:0 0 10px}ul{margin-top:0;margin-bottom:10px}ul ul{margin-bottom:0}.container{width:100%;padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}.row{margin-right:-15px;margin-left:-15px}.col-md-11,.col-md-4,.col-md-8,.col-xs-12{position:relative;min-height:1px;padding-right:15px;padding-left:15px}.col-xs-12{float:left}.col-xs-12{width:100%}.pull-right{float:right!important}.pull-left{float:left!important}.hidden{display:none!important}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}aside,header{display:block}a{background-color:transparent}h1{font-size:2em;margin:.67em 0}svg:not(:root){overflow:hidden}input{color:inherit;font:inherit;margin:0}input[type=submit]{-webkit-appearance:button}input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=radio]{box-sizing:border-box;padding:0}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}html,input[type=search]{box-sizing:border-box}*,:after,:before{box-sizing:inherit}html{scroll-behavior:smooth}body{font-family:Poppins,Helvetica,Arial,sans-serif;font-weight:300!important;max-width:100%;overflow-x:hidden}body #wrapper{background-color:#fff}.bg_turquoise{background-color:#00a0a0}.bg_turquoise{background-color:#0056f0}iframe{max-width:100%}.middot{display:inline-block;border-radius:50%;height:3px;width:3px;background-color:#777474;vertical-align:middle}@font-face{font-family:Poppins;font-weight:300;font-style:normal;src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Light.eot);src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Light.eot?#iefix) format("embedded-opentype"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Light.woff2) format("woff2"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Light.woff) format("woff"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Light.ttf) format("truetype");font-display:swap}@font-face{font-family:Poppins;font-weight:400;font-style:normal;src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Regular.eot);src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Regular.eot?#iefix) format("embedded-opentype"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Regular.woff2) format("woff2"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Regular.woff) format("woff"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Regular.ttf) format("truetype");font-display:swap}@font-face{font-family:Poppins;font-weight:500;font-style:normal;src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Medium.eot);src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Medium.eot?#iefix) format("embedded-opentype"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Medium.woff2) format("woff2"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Medium.woff) format("woff"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Medium.ttf) format("truetype");font-display:swap}@font-face{font-family:Poppins;font-weight:600;font-style:normal;src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-SemiBold.eot);src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-SemiBold.eot?#iefix) format("embedded-opentype"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-SemiBold.woff2) format("woff2"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-SemiBold.woff) format("woff"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-SemiBold.ttf) format("truetype");font-display:swap}@font-face{font-family:Poppins;font-weight:700;font-style:normal;src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Bold.eot);src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Bold.eot?#iefix) format("embedded-opentype"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Bold.woff2) format("woff2"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Bold.woff) format("woff"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Bold.ttf) format("truetype");font-display:swap}@font-face{font-family:Poppins;font-weight:800;font-style:normal;src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-ExtraBold.eot);src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-ExtraBold.eot?#iefix) format("embedded-opentype"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-ExtraBold.woff2) format("woff2"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-ExtraBold.woff) format("woff"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-ExtraBold.ttf) format("truetype");font-display:swap}@font-face{font-family:Poppins;font-weight:900;font-style:normal;src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Black.eot);src:url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Black.eot?#iefix) format("embedded-opentype"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Black.woff2) format("woff2"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Black.woff) format("woff"),url(/wp-content/themes/taboola-new/assets/fonts/poppins/Poppins-Black.ttf) format("truetype");font-display:swap}.mb-20{margin:0 0 20px 0}.mt-20{margin:20px 0 0 0}body header#header{position:fixed;background-color:#fff;color:#0056f0;width:100%;top:0;height:74px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;left:0;z-index:1000;box-shadow:0 0 5px 0 rgba(0,0,0,.2)}body header#header a{color:#555;font-family:Poppins,Helvetica,Arial,sans-serif;font-weight:300!important;font-size:16px}body header#header #logo{width:140px;height:40px;display:inline-block;vertical-align:middle}body header#header #logo svg{width:100%}body header#header #desktop-menu{width:auto;display:none;padding:5px;margin-left:40px}body header#header #search{width:auto;display:none;position:relative;color:#555}body header#header #search *{color:#555}body header#header #search form.search-form{line-height:1;height:30px;border-radius:5px;color:#555;position:absolute;right:0;top:-14px}body header#header #search form.search-form label{width:0;overflow:hidden}body header#header #search form.search-form label span{display:none}body header#header #search form.search-form label input.search-field{border:none;border-bottom:1px solid #0056f0;color:#0056f0;margin:0;padding:5px 0;width:100%;overflow:hidden;opacity:0}body header#header #search form.search-form label input.search-field:-ms-input-placeholder{color:#0056f0;opacity:1}body header#header #search form.search-form label input.search-field:-ms-input-placeholder{color:#0056f0}body header#header #search form.search-form label input.search-field::-ms-input-placeholder{color:#0056f0}body header#header #search form.search-form input.search-submit{border:none;float:right;width:30px;height:30px;font-size:0;position:relative;padding:0;margin:0;color:#0056f0!important;z-index:-2}body header#header #search form.search-form i.fa{height:0;width:0;color:#0056f0!important;overflow:hidden;position:absolute;right:54px;left:auto;top:27px;background-image:url(/wp-content/themes/taboola-new/assets/images/close.svg);background-position:center;background-size:contain;background-repeat:no-repeat}body header#header #search form.search-form:after{content:"";width:20px;height:20px;position:absolute;z-index:1;right:0;top:4px;background-image:url(/wp-content/themes/taboola-new/assets/images/search-teal.svg);background-position:center;background-size:contain;background-repeat:no-repeat}body header#header .action-menu{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-direction:row-reverse;flex-direction:row-reverse;margin-top:7px}body header#header #mobile-menu{float:right;width:50px;margin-top:5px}body header#header #langs{position:relative;display:inline-block;vertical-align:middle}body header#header #langs .earth:before{content:"";background-image:url(/wp-content/themes/taboola-new/assets/images/globe.svg);background-position:center;background-size:contain;background-repeat:no-repeat;display:inline-block;width:27px;height:27px}body header#header #langs ul.lang_ul{position:absolute;z-index:1000;width:105px;list-style:none;font-size:14px;text-align:left;background-color:#fff;background-clip:padding-box;margin:0 -50px 0 0;right:50%;border:none;border-radius:5px;padding:5px 0;overflow:hidden;opacity:0;height:0;top:100%}body header#header #langs ul.lang_ul a{color:#555;text-decoration:blink!important;text-transform:capitalize;font-size:15px}body header#header #langs ul.lang_ul li{width:100%;background-color:transparent;color:#fff;padding:5px 15px}body header#header #langs ul.lang_ul li:last-child:after{display:none!important}body header#header .go_taboola{border:solid 1px transparent;text-align:center;border-radius:25px;text-decoration:blink;display:none;margin-top:2px;color:#0056f0;text-decoration:underline}body #wrapper{padding-top:74px}body #breadcrumbs{list-style:none;margin:0 0 20px;overflow:hidden;padding:0}body #breadcrumbs li{display:inline-block;vertical-align:middle;margin-right:5px}body #breadcrumbs li a{color:#e0e0e0}body #breadcrumbs li:after{content:"›";margin-left:5px;color:#e0e0e0}body #breadcrumbs li:last-of-type{color:#0056f0}body #breadcrumbs li:last-of-type:after{content:none;margin-left:0}#logo svg{fill:#0056f0!important;height:40px;width:140px;margin-top:5px}#desktop-menu .menu{margin:0;padding:0;list-style:none}#desktop-menu .menu li{position:relative}#desktop-menu .menu li.menu-item{display:inline-block;vertical-align:middle;margin-right:70px}#desktop-menu .menu li.menu-item .cj-dropdown-menu{display:none;position:absolute;opacity:0;top:102%;left:-20px;background:#fff;background:linear-gradient(180deg,rgba(255,255,255,0) 0,#fff 5%,#fff 100%);padding:30px 20px 20px;min-width:calc(100% + 40px);white-space:nowrap;border-radius:4px;box-shadow:0 20px 10px -12px rgba(0,0,0,.3);list-style:none}#desktop-menu .menu li.menu-item .cj-dropdown-menu li{margin:0 0 5px 0}#desktop-menu .menu li.menu-item .cj-dropdown-menu li a{font-size:14px}#desktop-menu .menu li.menu-item .cj-dropdown-menu li a.category-title{font-family:Poppins,Helvetica,Arial,sans-serif;font-weight:500!important;color:#0056f0;margin-bottom:15px;display:block}#desktop-menu .menu li.menu-item .cj-dropdown-menu ul{list-style:none;padding:0}#desktop-menu .menu li.menu-item .cj-dropdown-menu .category-link{color:#555;font-family:Poppins,Helvetica,Arial,sans-serif;font-weight:300!important;display:block}#desktop-menu .menu li.menu-item .cj-dropdown-menu .showMoreCategories{margin-bottom:5px;display:block;font-size:14px}#desktop-menu .menu li.menu-item .cj-dropdown-menu .moreCategories{height:0;visibility:hidden;margin:0}#desktop-menu .menu li.menu-item .cj-dropdown-menu .menu-category-list{margin-right:50px;border-right:1px solid #efefef}#desktop-menu .menu li.menu-item .cj-dropdown-menu .menu-category-list:last-of-type{border-right:none;margin-right:0}#desktop-menu .menu li.menu-item .cj-dropdown-menu .menu-column{margin-right:50px}#desktop-menu .menu li.menu-item .cj-dropdown-menu .flex-row{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}#desktop-menu .menu li.menu-item .cj-dropdown-menu .flex-col{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}#desktop-menu .menu li .parent-link{position:relative}#desktop-menu .menu li .parent-link:before{height:1px;content:"";background-color:#0056f0;width:0;bottom:-4px;position:absolute;left:0}#mobile-menu .menu_slide{transform:translateX(100%);background-color:#0056f0;width:280px;height:calc(100% - 73px);line-height:1;overflow:hidden;position:fixed;bottom:0;right:0;border-top:1px solid #fff}#mobile-menu .menu_slide .menu-scroll-container{overflow-y:scroll;height:calc(100% - 48px)}#mobile-menu .menu_slide #mobile-categories-list{margin:0;padding:0;list-style:none}#mobile-menu .menu_slide #mobile-categories-list>li{color:#fff}#mobile-menu .menu_slide #mobile-categories-list input{display:none}#mobile-menu .menu_slide #mobile-categories-list label{display:-ms-flexbox;display:flex;width:100%;margin:0;padding:22px 30px 16px;font-size:18px;font-family:Poppins,Helvetica,Arial,sans-serif;font-weight:300!important;border-bottom:1px solid #0c6af2;position:relative}#mobile-menu .menu_slide #mobile-categories-list label .toggle-arrow{background-image:url(/wp-content/themes/taboola-new/assets/images/arrow.svg);background-position:center;background-size:contain;background-repeat:no-repeat;width:16px;height:16px;margin-top:-8px;transform:rotate(-90deg);position:absolute;right:25px;top:50%}#mobile-menu .menu_slide #mobile-categories-list .content{margin:0;padding:0;list-style:none;max-height:0;overflow:hidden;background:#0c6af2;border-bottom:1px solid #0056f0}#mobile-menu .menu_slide #mobile-categories-list .content li{line-height:1.3;padding:10px 0 10px 45px}#mobile-menu .menu_slide #mobile-categories-list .content li a{color:#fff;font-size:14px}#mobile-menu .menu_slide #mobile-categories-list .content .showMoreCategories{display:block}#mobile-menu .menu_slide #mobile-categories-list .content .moreCategories{display:none}#mobile-menu .menu_slide .taboola-com-btn{position:absolute;left:0;width:100%;bottom:0;right:0;padding:18px 20px 14px 30px;background:#0c6af2;color:#fff}#mobile-menu .menu_slide .search{width:100%;margin:0;display:block;padding:22px 30px 20px 30px;border-bottom:1px solid #0c6af2}#mobile-menu .menu_slide .search form.search-form{position:relative;line-height:1}#mobile-menu .menu_slide .search form.search-form label{width:100%;overflow:hidden;margin:0}#mobile-menu .menu_slide .search form.search-form label span{display:none}#mobile-menu .menu_slide .search form.search-form label input.search-field{border:none;border-bottom:1px solid #fff;margin:0;width:100%;overflow:hidden;-webkit-appearance:none;padding:5px 25px 5px 0}#mobile-menu .menu_slide .search form.search-form input.search-submit{border:none;float:right;width:30px;height:30px;font-size:0;padding:0;margin:0;z-index:2;position:absolute;top:0;right:0}#mobile-menu .menu_slide .search form.search-form:after{content:"";background-image:url(/wp-content/themes/taboola-new/assets/images/search.svg);background-position:center;background-size:contain;background-repeat:no-repeat;width:16px;height:16px;position:absolute;z-index:1;right:0;top:5px;text-align:center}#mobile-menu .triger_menu{width:30px;background-color:transparent;padding:5px 0;float:right;display:block}#mobile-menu .triger_menu span{width:100%;height:3px;margin-bottom:6px;border-radius:3px;display:block;background-color:#0056f0}#mobile-menu .triger_menu span:last-child{margin-bottom:0}.menu-block{display:none;width:100%;height:130vh;position:fixed;background:rgba(162,162,162,.8);top:0;left:0;z-index:1}body #featured{background-position:center;background-size:cover;min-height:auto!important;max-height:none!important;color:#fff;text-align:center;margin-bottom:45px;display:block;width:100%}footer#footer .widget_footer ul li{margin:0 0 15px}footer#footer .widget_footer ul li a{color:#676767;font-size:14px}form.search-form label{font-size:0;line-height:1}form.search-form input{font-size:16px;color:#fff;background-color:transparent;font-weight:100;width:100%;margin:8px 0;border-radius:1px;padding:15px}#header .search-result{display:none;position:absolute;background:#fff;top:60px;width:100%;text-align:left;box-shadow:0 20px 10px -12px rgba(0,0,0,.3);padding:0 2em 1em 2em}#sidebar{max-width:305px;padding:0}#sidebar aside{width:100%;padding:0;margin:0 0 30px;color:#fff;font-size:17px;text-align:left;color:#333;font-size:14px}#sidebar aside.bg_turquoise{border:none;background-color:transparent;margin:15px 0 30px 0;background-color:#0056f0}#sidebar aside.bg_turquoise .campaign-cta-wrapper{width:100%;padding:40px 40px 40px 48px}#sidebar aside.bg_turquoise .campaign-cta-wrapper h4{color:#fff;margin:10px 0;width:100%;font-size:27px;line-height:1.2em}#sidebar aside.bg_turquoise .btn{font-size:16px;color:#fff;background-color:#0056f0;font-family:Poppins,Helvetica,Arial,sans-serif;font-weight:400!important;border-radius:30px;display:inline-block;padding:9px 30px 9px;border:1px solid #fff;margin:5px 0 0 0;text-transform:capitalize;min-width:auto;max-width:100%;white-space:normal}#strip_campaign .btn.campaign{font-size:16px;color:#fff;background-color:#0056f0;font-family:Poppins,Helvetica,Arial,sans-serif;font-weight:400!important;border-radius:30px;display:inline-block;padding:9px 30px 9px;border:1px solid #fff;margin:5px 0 0 0;text-transform:capitalize;min-width:auto;max-width:100%;white-space:normal}body.single #content .sticky-mobile-cta{background-color:#0056f0;position:fixed;bottom:0;left:0;right:0;width:100%;height:60px;bottom:-60px;z-index:999;padding:20px 0;text-align:center}body.single #content .sticky-mobile-cta a{color:#fff}.campaign-cta-wrapper a{color:#0056f0!important}@media (min-width:768px){.container{width:750px}body header#header #search form.search-form label{margin-bottom:-1px}}@media screen and (min-width:768px){body header#header .action-menu{width:150px}}@media only screen and (min-width:990px){body.single #content .sticky-mobile-cta{display:none}}@media (min-width:992px){.container{width:970px}.col-md-11,.col-md-4,.col-md-8{float:left}.col-md-11{width:91.66666667%}.col-md-8{width:66.66666667%}.col-md-4{width:33.33333333%}}@media only screen and (min-width:992px){footer#footer .widget_footer ul li{margin:0 0 23px}#sidebar aside{padding:0 0;margin:0 0 60px!important}}@media screen and (min-width:1024px){.col-centered{float:none;margin:0 auto;padding:0}}@media (min-width:1200px){.container{width:1170px}}@media only screen and (min-width:1200px){body header#header .container{padding-top:6px}body header#header #desktop-menu{display:block;margin-top:4px}body header#header #search{display:inline-block;vertical-align:middle}body header#header #langs .earth:before{width:20px;height:20px;margin-top:5px}body header#header .go_taboola{display:inline-block}#mobile-menu{display:none}}@media screen and (min-height:789px){#sidebar aside{font-size:16px}}@media screen and (min-height:960px){#sidebar aside{margin:0 0 60px!important}}@media only screen and (max-width:992px){#sidebar{display:none}}@media screen and (max-width:460px){body #breadcrumbs li{font-size:10px}}.hs-inline-form{background-color:#f2f5f7;padding:60px 80px;margin:30px 0}.hs-inline-form h4{margin-bottom:30px}input:-ms-input-placeholder{color:#555}input::-webkit-input-placeholder{color:#555}input::-moz-placeholder{color:#555}input:-ms-input-placeholder{color:#555}input:-moz-placeholder{color:#555}.single-post-share-buttons{margin:20px 0}.single-post-share-buttons .share-button{width:35px;height:35px;display:inline-block;vertical-align:middle;margin-right:15px;background-position:center;background-size:contain;background-repeat:no-repeat}.single-post-share-buttons .facebook{background-image:url(/wp-content/themes/taboola-new/assets/images/facebook_gray.svg)}.single-post-share-buttons .twitter{background-image:url(/wp-content/themes/taboola-new/assets/images/twitter_gray.svg)}.single-post-share-buttons .linkedin{background-image:url(/wp-content/themes/taboola-new/assets/images/linkedin_gray.svg)}body.single header.post-info{background-color:#fff;color:#000;margin-bottom:0;padding:0;display:inline-block}body.single header.post-info .post-title h1{font-family:Poppins,Helvetica,Arial,sans-serif;font-weight:500!important;color:#333;text-align:left;font-size:30px;line-height:1.2}body.single header.post-info .post-by,body.single header.post-info .post-info-meta{color:#777474;font-size:14px;font-family:Poppins,Helvetica,Arial,sans-serif;font-weight:400!important;text-align:left;margin-bottom:0}body.single header.post-info .post-by{font-family:Poppins,Helvetica,Arial,sans-serif;font-weight:400!important}body.single header.post-info .post-by a{color:#777474!important}body.single header.post-info .middot{margin-left:5px;margin-right:5px}body.single #featured{height:435px;margin-bottom:25px}body.single #featured.image-post-desktop{display:none}body.single #featured.image-post-mobile{display:block}body.single #content{padding-bottom:45px}body.single #content p{color:#5d5d5d;line-height:1.7;margin-bottom:20px;text-align:left}body.single #content #breadcrumbs{padding-top:30px;margin:0 0 25px;font-size:14px}body.single #content #breadcrumbs a,body.single #content #breadcrumbs li:last-of-type{color:#777474}body.single #content #breadcrumbs .post-category a{font-family:Poppins,Helvetica,Arial,sans-serif;font-weight:400!important;color:#0056f0;font-size:14px}body.single #content a:not(.btn){color:#0056f0}body.single #content i,body.single #content p{font-size:16px;overflow-wrap:anywhere;word-break:normal}body.single .right-sidebar-wrapper .sidebar-item{margin-bottom:20px}body.single .right-sidebar-wrapper .sidebar-item .campaign-cta-wrapper{padding:15px 10px;text-align:left;width:213px}body.single .right-sidebar-wrapper .sidebar-item .campaign-cta-wrapper a{background-color:#0c6af2;color:#fff!important;padding:10px 30px;border-radius:25px;min-width:200px;border:none;display:inline-block;font-family:Poppins,Helvetica,Arial,sans-serif;font-weight:500!important}.row-no-padding [class*=col-]{padding-left:0!important;padding-right:0!important}.col-centered{float:none;margin:0 auto}#sidebar{position:sticky;top:110px}.progress-container{position:fixed;top:0;z-index:900;width:100%;background-color:#f1f1f1;width:100%;height:8px;background:#ccc}.progress-bar{height:8px;background:#0c6af2;width:0%}@media only screen and (min-width:768px){body.single #featured.image-post-desktop{display:block}body.single #featured.image-post-mobile{display:none}}@media only screen and (min-width:992px){body.single header.post-info .post-title h1{font-size:33px}body.single #content p{line-height:1.7;margin-bottom:25px}}@media screen and (min-width:1024px){.single-post-share-buttons{position:absolute;margin:0 0 0 -60px;top:0}.single-post-share-buttons .share-button{display:block;margin-bottom:10px;margin-right:0}body.single .right-sidebar-wrapper .sidebar-item .campaign-cta-wrapper{display:block}}@media screen and (min-height:667px){body.single .right-sidebar-wrapper .sidebar-item .campaign-cta-wrapper{padding:20px}}@media screen and (min-height:789px){body.single .right-sidebar-wrapper .sidebar-item .campaign-cta-wrapper{padding:30px}}@media screen and (min-height:960px){body.single .right-sidebar-wrapper .sidebar-item .campaign-cta-wrapper{padding:45px 30px}#sidebar{top:160px}}@media screen and (max-width:1200px){.progress-container{display:none}}@media screen and (max-width:767px){body.single .right-sidebar-wrapper .sidebar-item .campaign-cta-wrapper{width:100%}}@media only screen and (max-width:412px){body.single #featured{margin-bottom:0}body.single #content #breadcrumbs{padding-top:5px;list-style:1}} </style> <script type='application/ld+json'> { "@context": "http://schema.org/", "@type": "BlogPosting", "headline": "Optimising Chrome Extensions: Part 1 – Beyond Redux, Post-Manifest v3", "image": { "@type": "ImageObject", "url": "https://blog.taboola.com/wp-content/uploads/2023/12/shutterstock_15539709089-scaled.jpg" }, "datePublished": "2023-12-08", "dateModified": "2023-12-07 ", "author": { "@type": "Person", "name": "Eduardo Aparicio Cardenes" }, "publisher": { "@type": "Organization", "name": "Taboola", "url": "https://www.taboola.com", "logo": { "@type": "ImageObject", "url": "https://blog.taboola.com/wp-content/themes/taboola/assets/images/logo.jpg" }, "mainEntityOfPage": "https://blog.taboola.com/optimising-chrome-extensions-part-1/" } } </script> </head> <body class="single animated loaded"> <div class="menu-block" style=""></div>  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PC4JX7" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>  <div id="wrapper"> <header id="header"> <div class="container"> <a id="logo" class="pull-left" href="https://blog.taboola.com" title="Taboola Blog"> <svg viewBox="0 0 1003.26 190.69" fill="#0056f0" stock-width="0px"> <title>Taboola Blog</title> <g> <g> <g> <path d="M37.06,40.59H0V6.77h114.79v33.82h-37.1l.02,99.12h-40.63l-.02-99.12Z" /> <path d="M148.6,96.28c-4.46,2.2-9.48,3.47-14.49,4.55-8.18,1.81-12.45,3.82-12.49,10.31-.02,4.46,4.77,8.94,11.44,8.98,8.34.04,14.86-4.92,15.48-14.94l.05-8.91ZM183.73,118.19c-.05,7.23.28,15.4,4.32,21.54l-37.47-.22c-.91-2.6-1.45-6.5-1.24-9.09h-.38c-7.83,8.85-19.16,11.38-31.04,11.32-18.54-.11-33.88-9.1-33.78-29.32.18-30.42,35.79-29.1,54.54-32.51,5.01-.9,10.03-2.36,10.06-8.48.04-6.49-6.06-8.95-11.99-8.98-11.31-.05-13.58,5.68-13.78,9.75l-34.13-.19c1.26-27.07,26.88-31.38,49.7-31.25,45.99.27,45.52,19.38,45.4,37.92l-.22,39.51Z" /> <path d="M240.33,68.07c-13.16-.07-16.2,12.34-16.27,23.64-.07,11.5,2.83,23.95,15.99,24.03,13.17.07,16.21-12.34,16.28-23.84.07-11.31-2.83-23.76-16-23.83M189.13,6.56h36.72l-.27,47.7h.37c5.61-8.13,15.46-12.9,26.41-12.84,32.26.19,40.82,27.69,40.69,50.32-.14,24.11-13.47,50.92-40.72,50.77-17.99-.11-23.52-7-28.12-13.16h-.37l-.07,10.36h-34.64V6.56Z" /> <path d="M344.59,33.5c-13.92-.08-15.85,13.45-15.91,23.64-.05,10.2,1.72,23.94,15.63,24.03,13.91.07,15.85-13.63,15.91-23.84.06-10.2-1.72-23.75-15.63-23.83M344.15,107.87c-36.17-.21-52.36-24.23-52.19-50.94.16-26.71,16.61-50.35,52.78-50.13,36.17.2,52.36,24.03,52.2,50.75-.16,26.7-16.61,50.54-52.78,50.33" /> <path d="M435.72,33.5c-13.91-.08-15.84,13.45-15.9,23.65-.07,10.2,1.71,23.93,15.62,24.02,13.9.08,15.84-13.63,15.9-23.83.06-10.2-1.72-23.76-15.63-23.83M435.29,107.88c-36.16-.22-52.34-24.24-52.18-50.95.15-26.7,16.61-50.35,52.77-50.14,36.17.21,52.35,24.04,52.2,50.75-.16,26.71-16.62,50.54-52.79,50.34" /> <path d="M492.04,6.8h35.94v132.92h-35.94V6.8Z" /> <path d="M594.92,95.96c-4.46,2.19-9.48,3.46-14.48,4.54-8.19,1.81-12.45,3.83-12.49,10.32-.03,4.45,4.77,8.93,11.44,8.97,8.35.04,14.87-4.92,15.48-14.94l.05-8.89ZM630.26,117.85c-.03,7.23-.44,15.72,3.62,21.86h-36.91c-.9-2.6-1.53-7.04-1.32-9.63h-.37c-7.84,8.85-19.16,11.38-31.03,11.32-18.55-.12-33.89-9.11-33.78-29.33.18-30.42,35.78-29.09,54.53-32.5,5.01-.9,10.03-2.36,10.07-8.48.04-6.49-6.06-8.94-12-8.98-11.32-.06-13.57,5.67-13.77,9.75l-34.15-.19c1.27-27.08,26.9-31.39,49.71-31.24,46,.26,45.52,19.36,45.41,37.91v39.51Z" /> <path d="M305.73,107.88c26.08,11.65,53.13,16.82,82.61,16.99,30.97.18,54.46-5.67,84.19-16.99l-.17,32.08c-26.61,13.2-55.47,20.31-84.23,20.15-31.34-.19-53.93-6.62-82.6-20.15l.19-32.08Z" /> </g> <g> <path d="M745.94,82.84c5.24,6.19,7.87,13.46,7.87,21.8,0,6.82-1.61,12.92-4.83,18.29-3.22,5.37-8.03,9.6-14.41,12.7-6.38,3.1-14.12,4.64-23.22,4.64h-42.27V7.2h41.51c13.27,0,23.28,3.07,30.04,9.19,6.76,6.13,10.14,14.06,10.14,23.79,0,8.47-2.27,15.32-6.82,20.57-4.55,5.25-10.36,8.81-17.44,10.71,7.71,1.39,14.18,5.18,19.43,11.37ZM677.6,67.67h33.36c9.98,0,17.66-2.37,23.03-7.11,5.37-4.74,8.06-11.28,8.06-19.62s-2.65-14.47-7.96-19.15c-5.31-4.67-13.33-7.01-24.07-7.01h-32.41v52.89ZM736.08,125.2c6.13-5.12,9.19-12.16,9.19-21.14s-3.13-15.89-9.38-21.14c-6.26-5.24-14.82-7.87-25.69-7.87h-32.6v57.81h33.17c10.74,0,19.17-2.56,25.31-7.68Z" /> <path d="M775.98,0v140.27h-8.53V0h8.53Z" /> <path d="M815.22,135.34c-7.71-4.29-13.74-10.46-18.1-18.48-4.36-8.02-6.54-17.41-6.54-28.15s2.21-19.93,6.63-27.96c4.42-8.02,10.52-14.15,18.29-18.39,7.77-4.23,16.46-6.35,26.06-6.35s18.26,2.12,25.97,6.35c7.71,4.24,13.74,10.33,18.1,18.29,4.36,7.96,6.54,17.31,6.54,28.05s-2.21,20.13-6.63,28.15c-4.42,8.03-10.52,14.19-18.29,18.48-7.77,4.3-16.46,6.44-26.06,6.44s-18.26-2.15-25.97-6.44ZM862.13,129.18c6.51-3.35,11.72-8.44,15.64-15.26,3.92-6.82,5.88-15.23,5.88-25.21s-1.96-18.2-5.88-25.02c-3.92-6.82-9.1-11.91-15.54-15.26-6.44-3.35-13.4-5.02-20.85-5.02s-14.38,1.68-20.76,5.02c-6.38,3.35-11.53,8.44-15.45,15.26-3.92,6.82-5.88,15.16-5.88,25.02s1.92,18.39,5.78,25.21c3.85,6.82,8.97,11.91,15.35,15.26,6.38,3.35,13.3,5.02,20.76,5.02s14.44-1.67,20.95-5.02Z" /> <path d="M978.81,43.88c7.58,5.25,12.89,11.97,15.92,20.19v-26.73h8.53v106.15c0,9.48-2.08,17.79-6.25,24.93-4.17,7.14-9.79,12.64-16.87,16.49-7.08,3.85-14.97,5.78-23.69,5.78-12.89,0-23.57-3.1-32.04-9.29-8.47-6.19-14.03-14.53-16.68-25.02h8.53c2.53,8.21,7.27,14.75,14.22,19.62,6.95,4.86,15.61,7.3,25.97,7.3,7.2,0,13.71-1.61,19.52-4.83,5.81-3.22,10.39-7.84,13.74-13.84,3.35-6,5.02-13.05,5.02-21.14v-30.14c-3.03,8.22-8.37,15.01-16.02,20.38-7.65,5.37-16.84,8.06-27.58,8.06-9.6,0-18.17-2.18-25.68-6.54-7.52-4.36-13.4-10.55-17.63-18.58-4.24-8.02-6.35-17.34-6.35-27.96s2.11-19.9,6.35-27.86c4.23-7.96,10.11-14.09,17.63-18.39,7.52-4.29,16.08-6.44,25.68-6.44,10.87,0,20.09,2.62,27.68,7.87ZM989.14,64.92c-3.73-6.89-8.81-12.19-15.26-15.92-6.45-3.73-13.65-5.59-21.61-5.59s-15.67,1.8-21.99,5.4c-6.32,3.6-11.25,8.81-14.79,15.64-3.54,6.82-5.31,14.91-5.31,24.26s1.77,17.44,5.31,24.26c3.54,6.82,8.5,12.07,14.88,15.73,6.38,3.67,13.68,5.5,21.89,5.5s15.19-1.86,21.7-5.59c6.51-3.73,11.59-9.03,15.26-15.92,3.66-6.89,5.5-14.88,5.5-23.98s-1.87-16.9-5.59-23.79Z" /> </g> </g> </g> </svg> </a> <div id="desktop-menu" class="pull-left"> <ul id="menu-main-menu" class="menu"><li class="menu-item"> <a class="parent-link" href=" https://blog.taboola.com/category/advertisers-and-marketers/">Advertisers & Marketers</a> <ul class="cj-dropdown-menu mega"><li class="flex-col menu-category-list"><a href="https://blog.taboola.com/category/articles/" class="category-title">Articles</a><div class='flex-row'><ul class='menu-column'><li><a href="https://blog.taboola.com/category/ecommerce/" class="category-link">eCommerce</a></li><li><a href="https://blog.taboola.com/category/affiliate-marketing/" class="category-link">Affiliate Marketing</a></li><li><a href="https://blog.taboola.com/category/landing-pages/" class="category-link">Landing Pages</a></li><li><a href="https://blog.taboola.com/category/lead-generation/" class="category-link">Lead Generation</a></li><li><a href="https://blog.taboola.com/category/marketing-attribution/" class="category-link">Marketing Attribution</a></li><li><a href="https://blog.taboola.com/category/native-advertising/" class="category-link">Native Advertising</a></li><li><a href="https://blog.taboola.com/category/brand-awareness/" class="category-link">Brand Awareness</a></li></ul><ul class='menu-column'><li><a href="https://blog.taboola.com/category/content-marketing/" class="category-link">Content Marketing</a></li><li><a href="https://blog.taboola.com/category/performance-marketing/" class="category-link">Performance Marketing</a></li><li><a href="https://blog.taboola.com/category/taboola-best-practices/" class="category-link">Taboola Best Practices</a></li><li class="moreCategories"><a href="https://blog.taboola.com/category/programmatic-marketing/" class="category-link">Programmatic Marketing</a></li><li class="moreCategories"><a href="https://blog.taboola.com/category/video-marketing/" class="category-link">Video Marketing</a></li><li class="moreCategories"><a href="https://blog.taboola.com/category/driving-traffic/" class="category-link">Driving Traffic</a></li><li class="moreCategories"><a href="https://blog.taboola.com/category/agencies/" class="category-link">Agencies</a></li><li><span class="showMoreCategories">More..</span></li></ul></div></li><li class="flex-col menu-category-list"><a href="https://blog.taboola.com/category/resources/" class="category-title">Resources</a><div class='flex-row'><ul class='menu-column'><li><a href="https://blog.taboola.com/category/research-and-reports/" class="category-link">Research & Reports</a></li><li><a href="https://blog.taboola.com/create-ads-effortlessly/" class="category-link">GenAI Ad Maker</a></li><li><a href="https://trends.taboola.com/" class="category-link">Advertising Trends & Consumer Insights from Taboola Trends</a></li><li><a href="https://trends.taboola.com/headline-analyzer" class="category-link">Headline Title Analyzer</a></li></ul><ul class='menu-column'><li><a href="https://trends.taboola.com/trending-topics" class="category-link">Trending Topics</a></li><li class="moreCategories"><a href="https://trends.taboola.com/image-trends" class="category-link">Trending Images</a></li><li><span class="showMoreCategories">More..</span></li></ul></div></li></ul></li><li class="menu-item"> <a class="parent-link" href=" https://blog.taboola.com/category/publishers/">Publishers</a> <ul class="cj-dropdown-menu "><li><a href="https://blog.taboola.com/category/case-studies/" class="category-link">Case Studies</a></li><li><a href="https://blog.taboola.com/category/data-and-trends/" class="category-link">Data & Trends</a></li><li><a href="https://blog.taboola.com/category/revenue-optimization/" class="category-link">Revenue Optimization</a></li></ul></li><li class="menu-item"> <a class="parent-link" href=" #">Company</a> <ul class="cj-dropdown-menu mega"><li class="flex-col menu-category-list"><a href="https://blog.taboola.com/category/taboola-updates/" class="category-title">Taboola Updates</a><div class='flex-row'><ul class='menu-column'><li><a href="https://blog.taboola.com/category/product-news/" class="category-link">Product News</a></li><li><a href="https://blog.taboola.com/category/taboola-life/" class="category-link">Taboola Life</a></li></ul><ul class='menu-column'><li class="moreCategories"><a href="https://blog.taboola.com/category/taboola-news/" class="category-link">Company News</a></li><li><span class="showMoreCategories">More..</span></li></ul></div></li></ul></li><li class="menu-item"> <a class="parent-link" href=" https://blog.taboola.com/category/engineering/">Engineering</a> <ul class="cj-dropdown-menu "><li><a href="https://blog.taboola.com/category/big-data/" class="category-link">Big Data</a></li><li><a href="https://blog.taboola.com/category/culture/" class="category-link">Culture</a></li><li><a href="https://blog.taboola.com/category/data-science/" class="category-link">Data Science</a></li><li><a href="https://blog.taboola.com/category/java/" class="category-link">Java</a></li><li><a href="https://blog.taboola.com/category/javascript/" class="category-link">Javascript</a></li><li><a href="https://blog.taboola.com/category/machine-learning/" class="category-link">Machine Learning</a></li><li><a href="https://blog.taboola.com/category/system/" class="category-link">System</a></li><li><a href="https://blog.taboola.com/category/tips-and-tricks/" class="category-link">Tips and Tricks</a></li></ul></li></ul> </div> <div id="mobile-menu"> <div class="triger_menu"> <span></span> <span></span> <span></span> </div> <div class="menu_slide"> <div class="menu-scroll-container"> <div class="search"> <form role="search" method="get" class="search-form" action="https://blog.taboola.com/" autocomplete="off"> <label> <span class="screen-reader-text">Search for:</span> <input type="search" class="search-field" placeholder="Search …" value="" name="s"> </label> <input type="submit" class="search-submit" value="Search"> <i class="fa fa-times closed" aria-hidden="true"></i> <div class="search-result" data-result></div> </form> </div> <ul id="mobile-categories-list"><li> <input type="radio" id="tab-0" name="categories" value="0"> <label class="toggleMobileCategoryList" for="tab-0">Advertisers & Marketers<span class="toggle-arrow"></span> </label><ul class="content"><li><a href="https://blog.taboola.com/category/ecommerce/">eCommerce</a></li><li><a href="https://blog.taboola.com/category/affiliate-marketing/">Affiliate Marketing</a></li><li><a href="https://blog.taboola.com/category/landing-pages/">Landing Pages</a></li><li><a href="https://blog.taboola.com/category/lead-generation/">Lead Generation</a></li><li><a href="https://blog.taboola.com/category/marketing-attribution/">Marketing Attribution</a></li><li><a href="https://blog.taboola.com/category/native-advertising/">Native Advertising</a></li><li><a href="https://blog.taboola.com/category/brand-awareness/">Brand Awareness</a></li><li><a href="https://blog.taboola.com/category/content-marketing/">Content Marketing</a></li><li class="moreCategories"><a href="https://blog.taboola.com/category/performance-marketing/">Performance Marketing</a></li><li class="moreCategories"><a href="https://blog.taboola.com/category/taboola-best-practices/">Taboola Best Practices</a></li><li class="moreCategories"><a href="https://blog.taboola.com/category/programmatic-marketing/">Programmatic Marketing</a></li><li class="moreCategories"><a href="https://blog.taboola.com/category/video-marketing/">Video Marketing</a></li><li class="moreCategories"><a href="https://blog.taboola.com/category/driving-traffic/">Driving Traffic</a></li><li class="moreCategories"><a href="https://blog.taboola.com/category/agencies/">Agencies</a></li><li class="moreCategories"><a href="https://blog.taboola.com/category/research-and-reports/">Research & Reports</a></li><li class="moreCategories"><a href="https://blog.taboola.com/create-ads-effortlessly/">GenAI Ad Maker</a></li><li class="moreCategories"><a href="https://trends.taboola.com/">Advertising Trends & Consumer Insights from Taboola Trends</a></li><li class="moreCategories"><a href="https://trends.taboola.com/headline-analyzer">Headline Title Analyzer</a></li><li class="moreCategories"><a href="https://trends.taboola.com/trending-topics">Trending Topics</a></li><li class="moreCategories"><a href="https://trends.taboola.com/image-trends">Trending Images</a></li><li class="showMoreCategories">More..</li></ul></li><li> <input type="radio" id="tab-1" name="categories" value="1"> <label class="toggleMobileCategoryList" for="tab-1">Publishers<span class="toggle-arrow"></span> </label><ul class="content"><li><a href="https://blog.taboola.com/category/case-studies/">Case Studies</a></li><li><a href="https://blog.taboola.com/category/data-and-trends/">Data & Trends</a></li><li><a href="https://blog.taboola.com/category/revenue-optimization/">Revenue Optimization</a></li></ul></li><li> <input type="radio" id="tab-2" name="categories" value="2"> <label class="toggleMobileCategoryList" for="tab-2">Company<span class="toggle-arrow"></span> </label><ul class="content"><li><a href="https://blog.taboola.com/category/product-news/">Product News</a></li><li><a href="https://blog.taboola.com/category/taboola-life/">Taboola Life</a></li><li><a href="https://blog.taboola.com/category/taboola-news/">Company News</a></li></ul></li><li> <input type="radio" id="tab-3" name="categories" value="3"> <label class="toggleMobileCategoryList" for="tab-3">Engineering<span class="toggle-arrow"></span> </label><ul class="content"><li><a href="https://blog.taboola.com/category/big-data/">Big Data</a></li><li><a href="https://blog.taboola.com/category/culture/">Culture</a></li><li><a href="https://blog.taboola.com/category/data-science/">Data Science</a></li><li><a href="https://blog.taboola.com/category/java/">Java</a></li><li><a href="https://blog.taboola.com/category/javascript/">Javascript</a></li><li><a href="https://blog.taboola.com/category/machine-learning/">Machine Learning</a></li><li><a href="https://blog.taboola.com/category/system/">System</a></li><li><a href="https://blog.taboola.com/category/tips-and-tricks/">Tips and Tricks</a></li></ul></li></ul> <a class="taboola-com-btn" href="https://www.taboola.com?int_source=blog_taboola-header-button_A_{Optimising Chrome Extensions: Part 1 – Beyond Redux, Post-Manifest v3}_{taboola.com}" target="_blank" title="Go to Taboola.com !"> www.taboola.com </a> </div> </div> </div> <div class="action-menu pull-right"> <a href="https://www.taboola.com?int_source=blog_taboola-header-button_A_{Optimising Chrome Extensions: Part 1 – Beyond Redux, Post-Manifest v3}_{taboola.com}" title="Go to Taboola.com !" target="_blank" class="go_taboola borderiko">taboola.com</a> <div id="langs"> <div class="earth"> <ul class="lang_ul"> <li><a href="https://blog.taboola.com/optimising-chrome-extensions-part-1/" title="English"> English</a></li> <li><a href="https://blog.taboola.com/de/" title="Deutsch"> Deutsch</a></li> <li><a href="https://blog.taboola.com/fr/" title="Français"> Français</a></li> <li><a href="https://blog.taboola.com/ja/" title="日本語"> 日本語</a></li> <li><a href="https://blog.taboola.com/pt/" title="Português"> Português</a></li> <li><a href="https://blog.taboola.com/es/" title="Español"> Español</a></li> <li><a href="https://blog.taboola.com/zh/" title="中文 (台灣)"> 中文 (台灣)</a></li> </ul> </div> </div> <div id="search"> <form role="search" method="get" class="search-form" action="https://blog.taboola.com/" autocomplete="off"> <label> <span class="screen-reader-text">Search for:</span> <input type="search" class="search-field" placeholder="Search …" value="" name="s"> </label> <input type="submit" class="search-submit" value="Search"> <i class="fa fa-times closed" aria-hidden="true"></i> <div class="search-result" data-result></div> </form> </div> </div> </div>  </header>  <script type="text/javascript"> var waitForGlobal = function(key, callback) { if (window[key]) { callback(); } else { setTimeout(function() { waitForGlobal(key, callback); }, 100); } }; </script> <div class="progress-container"> <div class="progress-bar"></div> </div> <div id="content" class="container"> <div class="row "> <div class="col-xs-12 col-md-11 col-centered"> <div class="row row-no-padding"> <div class="col-xs-12 mobile-featured"> <div id="featured" class="image-post-mobile" style="background-image: url(https://blog.taboola.com/wp-content/uploads/2023/12/shutterstock_15539709089-scaled.jpg)"></div> </div> </div> <div class="row"> <div class="col-xs-12 col-md-8"> <div class="breadcrumbs"> <ul id="breadcrumbs"><li class="post-category"><a href="https://blog.taboola.com/category/engineering/">Engineering</a></li></ul> </div> </div> </div> <div class="row"> <div class="col-xs-12 col-md-8 "> <header class="post-info"> <div class="post-title"> <div class="col-xs-12"> <div class="row"> <h1 class="mb-20">Optimising Chrome Extensions: Part 1 – Beyond Redux, Post-Manifest v3</h1> </div> </div> </div> <div class="post-info-meta"> <span class="post-by"> Posted by <a href="https://blog.taboola.com/author/eduardo-aparicio-cardenes/" title="Posts by Eduardo Aparicio Cardenes" class="author url fn" rel="author">Eduardo Aparicio Cardenes</a> </span> <i class="middot">   </i> <span class="posted-on"> <time class="entry-date published" datetime="Dec 08">Dec 08</time></span> <i class="middot">   </i> 7 Minutes read </div> </header> </div> <div class="col-xs-12 col-md-8 mt-20"> <div class="article-content-wrapper"> <div id="featured" class="image-post-desktop" style="background-image: url(https://blog.taboola.com/wp-content/uploads/2023/12/shutterstock_15539709089-scaled.jpg)"></div><p data-pm-slice="1 1 []">The landscape of Chrome extension development underwent a significant shift with the introduction of Manifest v3. In this article, we’ll explore the journey of why we decided to part ways with the Redux ecosystem in our Chrome extension after adopting Manifest v3. We aim to provide insights and guidance for fellow extension developers facing similar decisions in selecting their tech stack.</p> <h2>The Redux Era in Chrome Extension Development</h2> <p>Our initial foray into Chrome extension development was rooted in manifest v2, where we employed a robust React-Redux stack. This setup, bolstered by the <a href="https://github.com/tshaddix/webext-redux" target="_blank" rel="noopener">webext-redux</a> package by Tyler Shaddix, facilitated seamless state management across background scripts and content scripts. The Chrome runtime connect mechanism allowed real-time synchronisation using the subscription pattern, enabling easy usage of Redux across all our scripts.</p> <h3>Challenges Encountered</h3> <p>However, no architecture is without its challenges. One notable drawback was the duplication of the store in memory across every tab where our extension ran. As our application grew in complexity, this led to potential inefficiencies, particularly considering today’s systems that might run many tabs simultaneously.</p> <p>Additionally, the changes introduced in manifest v3, where the background script no longer persisted in memory, presented a hurdle. Connections reset unless explicitly persisted in the cache, aligning with the new architecture’s goal of handling incoming messages efficiently.</p> <p><img decoding="async" src="https://lh7-us.googleusercontent.com/aACIJqRvP8uECFY9GkgZlsY7WxJjmRWweb_210l7RLgx2OnoPGB0v0KlQ4ufLNdpFwTipeGZZsKfsX_pkdl2UA7bPZ1RoYGhxMBj_LFzEqIcbLHaFI9QxKtM10NQJvgeLoKXMpP-ncwspH7H-Yz7-ck" width="602.637316277631" height="571" /></p> <h3>Adapting to Manifest v3: A Redux Dilemma</h3> <p>While Redux had served us well, its drawbacks in the context of Chrome extension development became apparent:</p> <ul> <li><strong>Duplication of Store:</strong> Storing the same data in memory across multiple tabs posed scalability challenges.</li> <li><strong>Service Worker Synchronization:</strong> Maintaining synchronisation between reloads and shutdowns of the service worker became a requirement, introducing complexities like caching and restoring the store and making changes to enable broadcasting state as runtime connect is lost between SW executions.</li> <li><strong>Increased Message Overhead:</strong> Numerous messages between content and background scripts, especially during data loading from the network, added overhead that could be mitigated.</li> <li><strong>Redux as a Cache:</strong> In some scenarios, using Redux as a glorified cache became counterproductive as there are better approaches, particularly on extension, to overcome these difficulties.</li> </ul> <h3>Alternative Paths for Redux Enthusiasts</h3> <p>While our journey led us to part ways with Redux in our Chrome extension, we understand that some developers may still be keen on persisting with this familiar tool. Fear not, for alternatives exist in the post-manifest v3 era, offering compatibility and viable solutions:</p> <ul> <li>Npm package <a href="https://www.npmjs.com/package/@eduardoac-skimlinks/webext-redux" target="_blank" rel="noopener">@eduardoac-skimlinks/webext-redux</a><br /> For developers determined to stick with Redux using webext-redux, I’ve introduced a series of changes to support manifest v3. This new package implements the suggested alterations for manifest v3 compatibility, addressing specific challenges highlighted in <a href="https://github.com/tshaddix/webext-redux/pull/282" target="_blank" rel="noopener">PR-282 within Webext-redux</a>. By embracing this alternative, you can seamlessly continue leveraging Redux while ensuring alignment with the requirements of manifest v3.</li> <li>Npm package <a href="https://github.com/hindmost/reduxed-chrome-storage" target="_blank" rel="noopener">reduxed-chrome-storage</a><br /> This standalone provider offers a dedicated solution for storing the Redux store in the Chrome storage cache. While it may require a shift in your approach, this alternative ensures persistence and efficient data handling within the Chrome ecosystem.</li> </ul> <p>Choosing the right path post-manifest v3 depends on your specific needs, preferences, and the intricacies of your extension. As you embark on this alternative journey, consider the nuances of each solution to find the best fit for your Redux-powered Chrome extension.</p> <p>Remember, adaptability is key in the ever-evolving landscape of Chrome extension development.</p> <h2>Moving Beyond Redux: Embracing Efficiency</h2> <p>In our journey towards adapting to the changes brought by manifest v3, it became evident that the challenges posed by Redux in the Chrome extension context were becoming more pronounced. We recognised the need for a more efficient and streamlined approach to handle state management without the inherent complexities of Redux.</p> <p><img fetchpriority="high" decoding="async" src="https://lh7-us.googleusercontent.com/k1vg2si67O7jTMxwPhJ4S8UjsjEbh7PiFksDDzpj4jSEw8VINguzisSl5DI-0UC3vA0TOlbXbKTBJte2VGtA7gJJ0PvJTNVDTgsUxh-seTCTkGxrqgHkhu49KN5tYDUZWM-t3Cr8Uel24v1htTTIwzs" width="602" height="275" /></p> <h3>Minimising User Impact</h3> <p>The imperative to minimise the impact on the end-user experience was at the forefront of our considerations. The duplication of the store in memory across tabs, an inherent characteristic of Redux, emerged as a significant concern. Our quest for alternatives took shape, intending to reduce unnecessary redundancies, ensuring a smoother and more resource-efficient user journey.</p> <h3>Exploring efficiency mechanism for caching data on the extension</h3> <h4>Caching Headers</h4> <p>In our pursuit of efficiency, we considered implementing caching headers in responses. However, a significant challenge emerged regarding URL paths. Using URL matching, the cache risked retrieving items from another user’s session, notably when two users shared the same computer.</p> <p>This issue was exacerbated by using an authentication header instead of a cookie for these requests (More details in <a href="http://greenbytes.de/tech/webdav/rfc7234.html#response.cacheability" target="_blank" rel="noopener">Section 4.2 of [RFC7235]</a>). Unfortunately, adapting for caching headers would require substantial changes due to our existing API structure and credential handling.</p> <p>Furthermore, it’s essential to note that once caching headers are stored, they cannot be purged automatically. Manual user action is required, introducing an additional layer of complexity.</p> <p>As a result, our proposed solution had to be temporarily shelved. This setback underscores the intricate considerations and limitations in optimising our extension’s efficiency, particularly when faced with challenges that, for now, remain insurmountable.</p> <h4>Chrome Storage</h4> <p>Following challenges encountered with the browser cache, we determined that the optimal solution for persisting data between service worker executions was to leverage the Chrome Storage API. This approach enabled asynchronous persistence of the data required for the extension to function. However, our exploration revealed complexities associated with handling concurrency.</p> <p>For an in-depth understanding of these complexities and how we manage concurrency in Chrome Extensions, please check out our detailed explanation in <a href="https://medium.com/@byeduardoac/managing-concurrency-in-chrome-extensions-86de537c911d" target="_self" rel="noopener">Managing Concurrency in Chrome Extensions</a>. This additional resource delves into the intricacies of ensuring seamless data persistence within the Chrome Storage API.</p> <h3>Optimising pub-sub messaging efficiency</h3> <p>Messaging in Redux necessitates a constant back-and-forth to keep all tabs synchronised, given that the store is shared across them. However, upon a thorough analysis of our system, we identified two main flaws contributing to the high message volume.</p> <p>Firstly, recognising that each tab requires information based on its context, we realised that tabs don’t need to retain all data in the Redux store. For instance, if Tab 1 needs data A to render and Tab 2 needs data B, Tab 1 doesn’t need to keep both A and B in Redux. We pivoted towards a content script-centric approach, where each script requests and retains only the required data, minimising the message volume to essential updates.</p> <p>Secondly, we revisited how data was requested in Redux, opting for a more holistic approach. Rather than asking for specific sections of the state in the store, we crafted messages with enough abstraction. These messages are designed to be comprehensive, eliminating the need for multiple requests. This approach strikes a middle ground, simplifying the process without the complexity of fetching all data in a single message, akin to GraphQL.</p> <p>This strategic shift aimed to free us from the constraints of duplicated stores across multiple tabs, seamlessly aligning with our overarching goal of optimising the extension’s performance.</p> <h2>Benefits of Moving Beyond Redux</h2> <h4>Simplified Architecture</h4> <p>The decision to distance ourselves from Redux brought about a significant simplification of our extension’s architecture. Given the evolving landscape driven by manifest v3, this streamlining process proved especially crucial, which nudged us towards adopting more efficient and streamlined development practices.</p> <h4>Empowering Content Scripts with Greater Autonomy</h4> <p>Rather than constructing our extension around a centralised state for the entire application, we’ve embraced a paradigm where each content script manages its internal state independently. In this approach, we leverage the service worker as both a cache and a sophisticated data processing system, facilitating efficient persistence of network data.</p> <p>Despite the advancements in our architecture, synchronisation of shared data remains essential. We achieve this by utilising the service worker to broadcast data across all scripts, a mechanism akin to how webext-redux listened for state changes.</p> <h2>Future-Proofing Extension Development</h2> <h4>Adapting to Manifest v3</h4> <p>Moving beyond Redux was not merely a reaction to challenges but a proactive response to the transformative changes introduced by Manifest v3. Adapting to this evolving architecture was paramount for ensuring our extension’s continued success and relevance in the dynamic Chrome ecosystem.</p> <h4>Continuous Quest for Optimization</h4> <p>The ever-evolving nature of Chrome extension development demands a perpetual quest for optimisation. Our exploration of tailored solutions aligned with this principle, ensuring our tech stack stays agile, responsive, and well-prepared to tackle future changes and challenges.</p> <p>In the dynamic landscape of Chrome extension development, our strategic shift beyond Redux is a testament to our commitment to efficiency, user satisfaction, and the perpetual pursuit of optimisation.</p> <h2>Conclusion: Crafting a Tailored Tech Stack</h2> <p>As Chrome extension developers, adapting to evolving architectures is crucial. While Redux has its merits, manifest v3 prompted a reassessment. By addressing the unique needs of our extension and opting for efficient data and state handling, we’ve developed a more tailored and effective approach beyond Redux’s constraints.</p> <p>Flexibility, adaptability, and an unceasing quest for optimisation are essential in the dynamic realm of Chrome extension development.</p> <p>“Moving beyond Redux in our Chrome extension post-manifest v3 wasn’t about abandoning a tool but embracing our extension’s evolving needs. By minimising user impact and exploring alternatives aligned with the new architecture, we’ve crafted a tech stack suiting the dynamics of post-manifest v3 Chrome extension development.”</p> <p>Stay tuned for our upcoming deep dive! Our follow-up post will reveal the practical implementation of our tailored tech stack, maximising extension performance. Expect step-by-step guidance, insightful code snippets, and real-world examples as we guide you through the seamless transition from Redux to our optimised approach. Elevate your Chrome extension development with our hands-on guide, pushing the boundaries of performance. Watch this space for cutting-edge insights and actionable tips!</p> <div class="single-post-share-buttons"> <a href="https://www.facebook.com/sharer/sharer.php?u=https://blog.taboola.com/optimising-chrome-extensions-part-1/&t=Optimising Chrome Extensions: Part 1 – Beyond Redux, Post-Manifest v3" title="Facebook Share Button" rel="nofollow noopener" target="_blank" class="share-button facebook"> </a> <a href="https://www.linkedin.com/sharing/share-offsite/?url=https://blog.taboola.com/optimising-chrome-extensions-part-1/" title="Linkedin Share Button" rel="nofollow noopener" target="_blank" class="share-button linkedin"> </a> <a href="https://twitter.com/intent/tweet?text=Optimising Chrome Extensions: Part 1 – Beyond Redux, Post-Manifest v3&url=https://blog.taboola.com/optimising-chrome-extensions-part-1/" title="Twitter Share Button" rel="nofollow noopener" target="_blank" class="share-button twitter"> </a> </div> </div> <footer class="post-info "> <span class="posted-on">Originally Published: <time class="entry-date published" datetime="8 December 2023">8 December 2023</time></span> </footer> <div id="strip_campaign"> <div class="contact_form"> <div class="row"> <div class="col-xs-12"> <div class="bg_turquoise strip_campaign_content"> <h4>Create Your Content Campaign Today!</h4> <a class='btn campaign' href=' https://signup.taboola.com/join?lan=en&int_source=blogpost_right-rail-button_Contact-Us_Optimising+Chrome+Extensions%3A+Part+1+%26%238211%3B+Beyond+Redux%2C+Post-Manifest+v3' target='_blank'>Start now</a> </div> </div> </div> </div> </div>  <div class="row feed-taboola"> <div class="col-xs-12"> <script src="//cdn.taboola.com/libtrc/taboolablog-sc/tfa.js"></script> <div id="taboola-below-article-thumbnails"></div> <script type="text/javascript"> window._taboola = window._taboola || []; _taboola.push({ mode: 'organic-thumbnails-a', container: 'taboola-below-article-thumbnails', placement: 'Below Article Thumbnails', target_type: 'mix' }); </script> </div> </div>  </div>  <div id="sidebar" class="col-xs-12 col-md-4 pull-right mt-20"> <div class="right-sidebar-wrapper"> <aside class="widget bg_turquoise"> <div class="sidebar-item"> <div class="campaign-cta-wrapper"> <h4> Create Your First Campaign with Taboola</h4> <div class=''><a class='btn' href=' https://signup.taboola.com/join?lan=en&int_source=blogpost_right-rail-button_Contact-Us_Optimising+Chrome+Extensions%3A+Part+1+%26%238211%3B+Beyond+Redux%2C+Post-Manifest+v3' target='_blank'>Start now</a></div> </div> </div> </aside> </div> </div> <div class="sticky-mobile-cta"> <div class=''><a class='' href=' https://signup.taboola.com/join?lan=en&int_source=blogpost_mobile-bottom-button_Contact-Us_Optimising+Chrome+Extensions%3A+Part+1+%26%238211%3B+Beyond+Redux%2C+Post-Manifest+v3' target='_blank'> Create Your First Campaign with Taboola</a></div></div> </div> </div> </div> </div> <script type="text/javascript"> window.ctaRef = "?int_source=blog_inline-link_A_Optimising Chrome Extensions: Part 1 – Beyond Redux, Post-Manifest v3_"; </script> </div>  <footer id="footer"> <div class="container"> <div class="row"> <style> .widget_footer { width: 50%; } @media only screen and ( max-width: 767px ) { .widget_footer { padding: 0 15px; } } @media only screen and ( min-width: 768px ) { .widget_footer { width: 19% !important; margin-right: 1% !important; } } </style> <div id="fw1" class="widget_footer"> <aside id="nav_menu-2" class="widget widget_nav_menu"><h3 class="widget-title">About Us</h3><div class="menu-about-us-container"><ul id="menu-about-us" class="menu"><li id="menu-item-4242" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-4242"><a target="_blank" rel="noopener" href="https://www.taboola.com/">Taboola Advertising Platform</a></li> <li id="menu-item-28758" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-28758"><a href="https://www.taboola.com/advertise">Advertise</a></li> <li id="menu-item-4243" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-4243"><a target="_blank" rel="noopener" href="https://engineering.taboola.com">Engineering Blog</a></li> <li id="menu-item-4245" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-4245"><a target="_blank" rel="noopener" href="https://www.taboola.com/terms-of-use">Terms of Use</a></li> <li id="menu-item-4246" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-4246"><a target="_blank" rel="noopener" href="https://www.taboola.com/cookie-policy">Cookie Policy</a></li> <li id="menu-item-4247" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-4247"><a target="_blank" rel="noopener" href="https://www.taboola.com/privacy-policy">Privacy Policy</a></li> <li id="menu-item-11635" class="california-only-link hidden menu-item menu-item-type-custom menu-item-object-custom menu-item-11635"><a href="https://ccparequest.taboola.com/">CCPA Notices</a></li> </ul></div></aside> </div> <div id="fw2" class="widget_footer"> <aside id="nav_menu-3" class="widget widget_nav_menu"><h3 class="widget-title">Categories</h3><div class="menu-categories-container"><ul id="menu-categories" class="menu"><li id="menu-item-11316" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-11316"><a href="https://blog.taboola.com/category/advertisers-and-marketers/">Advertisers & Marketers</a></li> <li id="menu-item-11318" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-11318"><a href="https://blog.taboola.com/category/publishers/">Publishers</a></li> <li id="menu-item-11319" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-11319"><a href="https://blog.taboola.com/category/taboola-updates/">Taboola Updates</a></li> <li id="menu-item-25952" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-25952"><a href="https://blog.taboola.com/category/company-news/">Company News</a></li> <li id="menu-item-25953" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-25953"><a href="https://blog.taboola.com/category/audience-engagement/">Audience Engagement</a></li> </ul></div></aside> </div> <div id="fw3" class="widget_footer"> <aside id="nav_menu-4" class="widget widget_nav_menu"><h3 class="widget-title">Topics</h3><div class="menu-topics-container"><ul id="menu-topics" class="menu"><li id="menu-item-16214" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-16214"><a href="https://blog.taboola.com/category/ecommerce/">eCommerce</a></li> <li id="menu-item-16213" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-16213"><a href="https://blog.taboola.com/category/affiliate-marketing/">Affiliate Marketing</a></li> <li id="menu-item-28764" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-28764"><a href="https://blog.taboola.com/category/marketing-attribution/">Marketing Attribution</a></li> <li id="menu-item-11325" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-11325"><a href="https://blog.taboola.com/category/native-advertising/">Native Advertising</a></li> <li id="menu-item-11324" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-11324"><a href="https://blog.taboola.com/category/lead-generation/">Lead Generation</a></li> <li id="menu-item-11326" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-11326"><a href="https://blog.taboola.com/category/performance-marketing/">Performance Marketing</a></li> <li id="menu-item-11320" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-11320"><a href="https://blog.taboola.com/category/brand-awareness/">Brand Awareness</a></li> <li id="menu-item-11321" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-11321"><a href="https://blog.taboola.com/category/content-marketing/">Content Marketing</a></li> <li id="menu-item-11322" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-11322"><a href="https://blog.taboola.com/category/driving-traffic/">Driving Traffic</a></li> <li id="menu-item-11323" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-11323"><a href="https://blog.taboola.com/category/landing-pages/">Landing Pages</a></li> <li id="menu-item-11327" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-11327"><a href="https://blog.taboola.com/category/taboola-best-practices/">Taboola Best Practices</a></li> <li id="menu-item-11328" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-11328"><a href="https://blog.taboola.com/category/video-marketing/">Video Marketing</a></li> <li id="menu-item-11329" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-11329"><a href="https://blog.taboola.com/category/revenue-optimization/">Revenue Optimization</a></li> </ul></div></aside> </div> <div id="fw4" class="widget_footer"> <aside id="nav_menu-25" class="widget widget_nav_menu"><h3 class="widget-title">Resources</h3><div class="menu-resources-en-container"><ul id="menu-resources-en" class="menu"><li id="menu-item-26870" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-26870"><a href="https://www.taboola.com/native-advertising">Native Advertising</a></li> <li id="menu-item-26871" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-26871"><a href="https://blog.taboola.com/effective-native-advertising-examples/">Native Advertising Examples</a></li> <li id="menu-item-27120" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-27120"><a href="https://blog.taboola.com/ecommerce-marketing-and-promotion/">Best eCommerce Marketing Strategies</a></li> <li id="menu-item-28726" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-28726"><a href="https://blog.taboola.com/how-to-grow-your-ecommerce-business/">How to Grow Your eCommerce Business</a></li> <li id="menu-item-28727" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-28727"><a href="https://blog.taboola.com/boost-ecommerce-roi/">Boost Your eCommerce ROI</a></li> <li id="menu-item-25938" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-25938"><a href="https://blog.taboola.com/introductory-guide-performance-marketing/">Guide to Performance Marketing</a></li> <li id="menu-item-26874" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-26874"><a href="https://blog.taboola.com/lead-generation-campaign/">Launch a Lead Generation Campaign</a></li> <li id="menu-item-26877" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-26877"><a href="https://blog.taboola.com/affiliate-marketing/">How to Start Affiliate Marketing</a></li> <li id="menu-item-27094" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-27094"><a href="https://blog.taboola.com/affiliate-marketing-promotion-methods/">Affiliate Marketing Strategies</a></li> <li id="menu-item-26879" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-26879"><a href="https://blog.taboola.com/affiliate-marketing-tools-for-beginners/">Tools for Affiliate Marketing</a></li> <li id="menu-item-26876" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-26876"><a href="https://blog.taboola.com/affiliate-marketing-products/">Top Selling Affiliate Products</a></li> <li id="menu-item-25945" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-25945"><a href="https://blog.taboola.com/high-ticket-affiliate-programs-products/">High Ticket Affiliate Marketing</a></li> <li id="menu-item-26949" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-26949"><a href="/conversion-rate-optimization-beginners-guide/">Conversion Rate Optimization</a></li> <li id="menu-item-26883" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-26883"><a href="https://blog.taboola.com/google-ads-alternative/">Google Ads Alternatives</a></li> </ul></div></aside> </div> <div id="fw6" class="widget_footer"> <aside id="text-2" class="widget widget_text"><h3 class="widget-title">Let’s Connect</h3> <div class="textwidget"></div> </aside> <aside id="text-4" class="widget widget_text"> <h3 class="widget-title custom"></h3> <div class="textwidget"> <ul class="socials_link"> <li> <a href="https://www.linkedin.com/company/taboola" target="_blank" title="Go to Linkedin page"> <i class="svg-icon svg-icon-linkedin"></i> </a> </li> <li> <a href="https://twitter.com/taboola" target="_blank" title="Go to Twitter page"> <i class="svg-icon svg-icon-twitter"></i> </a> </li> <li> <a href="https://www.facebook.com/taboola/" target="_blank" title="Go to Facebook page"> <i class="svg-icon svg-icon-facebook"></i> </a> </li> </ul> </div> </aside> </div> </div> </div> </footer>  <link rel='stylesheet' id='main-styles-css' href='https://blog.taboola.com/wp-content/themes/taboola-new/dist/css/main.min.css?ver=6.6.2' type='text/css' media='all' /> <link rel='stylesheet' id='page-styles-css' href='https://blog.taboola.com/wp-content/themes/taboola-new/dist/css/single.min.css?ver=6.6.2' type='text/css' media='all' /> <script type="text/javascript" src="https://blog.taboola.com/wp-content/themes/taboola-new/dist/js/main.min.js" id="taboola-main-js-js"></script> <script type="text/javascript" src="https://blog.taboola.com/wp-content/themes/taboola-new/dist/js/single.min.js" id="taboola-page-scripts-js"></script> <script type="text/javascript"> geoFunctions(function() { if (isCountryCodeInList([ "US", "CA", "GB", "AT", "FR", "ZA", "DE", "CH", "NZ", "ES", "AU", "IE", "BE", "LU", "MC", "MX", "PL", "NL", "BR", "JP", "IS", "NO", "SE", "FI", "DK", "IN", "IL" ])) { // Show in case of segmentation $(".segmented-row .nonsegmented-cta").removeClass("hidden"); } else { $(".segmented-row .segmented-cta").removeClass("hidden"); } // California if (getCountryCode() == "US" && getState() == "CA") { $(".california-only-link").removeClass("hidden"); } }); $(".nonsegmented-row .nonsegmented-cta").removeClass("hidden"); </script> </body> </html>

CINXE.COM

Optimising Chrome Extensions: Part 1 - Beyond Redux, Post-Manifest v3