Mastercard Dynamic Yield and Next.js 16 Partial Prerendering
Mastercard Dynamic Yield and Next.js 16 Partial Prerendering
October 2025
With the release of Next.js 16 in October 2025, it now has stable support[1] for partial prerendering (PPR) through Cache Components. Partial prerendering allows for the bulk of the page’s content to be sent to the browser as part of the original response (prerendered at build time or cached between requests), and for specific areas of the page to be streamed to the browser as their data becomes available.
In this diagram from Nextjs.org, Next.js serves the product details page first, and then streams two dynamic components to the browser as their data becomes available (perhaps a cart from the eCommerce system and the recommendations from a Dynamic Yield API recommendations campaign):
Other web frameworks may provide similar capabilities in varying stages of maturity, such as Astro Server Islands. If the website is cached by a CDN, Cloudflare or Fastly, a similar approach can be achieved less automatically using Cloudflare Workers or Fastly Edge Compute. Other CDNs’ edge computing may or may not have the required capabilities. Contact your technical account manager for more information.
Partial prerendering operation
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" data-d2-version="v0.7.1" preserveAspectRatio="xMinYMin meet" viewBox="0 0 1265 1419" role="img"><title>Sequence diagram showing the flow of page rendering and API calls across four components: Browser, Next.js Server, E-commerce Platform, and Mastercard Dynamic Yield. The process starts with the browser sending a request to the Next.js server, which returns an initial HTML response. The Next.js server initiates two API calls: one to the E-commerce Platform for cart data and another to Dynamic Yield for personalization (‘Choose’ API). The browser begins rendering the page with the first contentful paint while assets and third-party scripts load. Responses from both APIs return to the Next.js server, which then sends React Server Components with personalized data and cart data back to the browser. The sequence ends with complete page rendering and other requests.</title><svg class="d2-680017394 d2-svg" width="1265" height="1419" viewBox="-11 -10 1265 1419"><rect x="-11.000000" y="-10.000000" width="1265.000000" height="1419.000000" rx="0.000000" fill="#ffffff" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-680017394 .text {
font-family: "d2-680017394-font-regular" !important;
}
@font-face {
font-family: d2-680017394-font-regular;
src: url("data:application/font-woff;base64,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");
}
@font-face {
font-family: d2-680017394-font-semibold;
src: url("data:application/font-woff;base64,d09GRgABAAAAABY0AA4AAAAAKCwAB4EGAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABRAAAAGAAAABgFBcqGWNtYXAAAAGkAAAApwAAANYD1ATwY3Z0IAAAAkwAAAAmAAAAJgMSE71mcGdtAAACdAAAAPoAAAFZ/J7mimdhc3AAAANwAAAACAAAAAj//wAEZ2x5ZgAAA3gAAA4mAAAcjJNYZxVoZWFkAAARoAAAADYAAAA2BKefM2hoZWEAABHYAAAAJAAAACQPaRDjaG10eAAAEfwAAADAAAAAwNNTEgVsb2NhAAASvAAAAGIAAABirBak4G1heHAAABMgAAAAIAAAACAArwG2bmFtZQAAE0AAAAJrAAAFwUJfIx5wb3N0AAAVrAAAABwAAAAg/zsAZHByZXAAABXIAAAAaQAAAGnAPqRIAAQEagH0AAUAAAVwBIgAAAGCBXAEiAAAAkwAiAISAAACCwYEAgEBAQECoAAAbwAApHkAAAAAAAAAAEZTSSABQAAAISIIpP4mAAAIpAHaAAAAAQAAAAADvgV4AAAAIAAAeJxszDsuBAEcgPHfmMFgMN7jPcb7eQeFhEQholGKTpzAsdApiGy1B9h69yT/Taber/0lHxKpBIVMF5VSKldrXLlx58GTZy/efETQyqVrt+49tvLqPSIG0Y9edOI//uI3fuI7vuKzfY8uMSaVGTdhUm7KtBmFWXPmlRYsWrJsxao1lXUbNm3ZtmNXbU9j34FDR46dOHXm3AVDAAAA//8BAAD//2dhIrIAACkAvgCWANYA0gDCAOIAAAAa/nAAGgO+ABkEIQAeBXgAGgWgABkAAHicXI6/SsRAEMazJl7UJxAWYYYlFscu11ul2AQkTbxY7DT+gTsw9w5CGpspfJa5LmVeTBTXcOpVu99v+H185cX5Wb44zdITldhG8jbslXqnUX2+ib/a5+njg7MAVe9FPTkraonOQi1pUa+DIWDg2w1DDS/PG8mK+K6D2TKtQJIu9CDJfUApSR++W6KbWJLFEiaoYTfru6gzrT6cbUDS6zbcBRm8ltKTRoRKpjbI5DUS/S4DqF77y3njYjm7XZBSS0LMP8mgDMyaDR3y9D+PKjkG5V8gaVGNamjjZTCov4FBg6SRvLNNFyqvEcl9AQAA//8BAAD//3/0ZMIAAAAAAAH//wADeJykWXt0E+eVv9/3zdjIwvKMsWxT+ZGx/MQgS5YlHn5I8SM2tmQDJuDwLATitzGGEEHABA5Pb3cTIK9ma2qIszm73SbZJCWSCSIhy9nkbLt1fNJ4NyfbZnV2Q1KanjY46S6Rxnu+0ehha3Bo84fPSJfDfPfe372/+7ufAMMoAKNlXUAgHuyvqDI+J83OtjcfXA5ugLo2N0CJzgMASVUPyAZMDRjiqx7wAANoyg3AeYAFNGU0LRB4IY8X+FGy2/84fk1Us67bp7zE72cAAKMEcpg0syPSWctmnoVK3MCWzDyTD5/JUANDDUYT4vW8wOt59PEErp1gRwK/wQL9AwTH0SX8Ht4LBNKj334ZCCAAYIqNJiRYBPxe4E1ciy55ARBsmL6B3kB1sAD0CtEn0IMTaLBugI+NJlSahbUpGqzPMWBLWRVGKr3NmJFhtOn1NmNmptGG6qQvdvrFTo0ZgCELgB1iXRAPCdCqcEocPSUuKsdyAuJnJyC+6oHLoAICGJhiN8RxbkgYN5oEPRGIHglIIOzQraHAiaGbuAh9TzyOPvgt2in+Levyv4M3AQAQ8AKwKtYFqaAHI7TdDeIp1JASPDwPCKQBUzwGCZAHaXzycjekcB5IByJXQi6QqUii4rOIlC+BX8ALpVXYUmbAehT5iP+z/60frBJWtBhKN9QWNp5+2xV424daa3qbi4ube2vEnyJreddqo3FNdznrKtp4psO6rXlZYtKK1s6Kzme2lbAu/yfiQa7YUVnetIjDDvFkYmGTraKxIJFiOzD9KXuOPQt5UHs3cWZQQ4acdc5DEz3lhgzOAwvCMaXFG5A+R4O1KVnYXGpdmqYh+pzcfGwpS7bmkpbNLz19oOiK/b3B7kvHmpqOXeo+9C/V7iX7z/39pgvil9d6eq4hDXu20NFbO7ilp/HEm7t3v3misWvryeqOxoLeayhheBglXOulvSLh9Dbrgvmw8O68n1GqnAcSJe8TOA9oZO+Z1GRtCo5j9AKfFoXAb0fR/KsdHVfFqdHABz7U+Kj7QGXlAfejrGvHG2Lg/Hkx8MYO1vWhv2zlkVe7ul890gA0t14A5jLrAjU0K3gnk4RSRV+GeCAwTypgzNGqDlVOguRnEeIFrRD8Yy77CfmD/0t8K5BIdKzrA/HkB+Kh0PnsPun8TXdzvpydJIWOkg3zqGFe0EMEBOJkvuDNMuGY0Qie8vkC830+shg7bp/C6wL/wLqCvqARiUONf14uaOvS9/p8ofcwL7IuYMH6570nmEUpd2ZeYF70p/lIPOv6ZguEchV3UaqlfoX3yoFH3qumBvVcdCQTlmSYx7mBHXcDHh8DSvNqiROYMDXxSC9RtgoJcRd9YvvvxXYf2oieQc+gjcxjfhX53Td/xbr86eSzMK4HWBeoYLuCryw9mI1yLcb5GF8JNZCggeWon7Ta3BAveYcIBYA3swd+7r+FfD8nGh/5yq9mXX41+Yr24cD0p3GL2bOwAAr+sj5MCfdh1uw+DBNHWphRgk1JWi4gDaUL8csLYeK4EOIU+cme7b0mfj08LH59rTdCHv8RopXQM8glzC9YF2ggTTEGOUWRGBA1oGAvcECk2ekGwnkgKRgDBTQ0CimbWy1l+Xo04sPZ+z2DdvugZ7/4Dlo6dOTIEM4PfMS6yvvOb99+vq8cHxLb2nt72yHEcczvWRckQTpsvpvcqqhBFQVuIjUkBh1NBgJqyVE154Z548H0c3LSU6VphASk5/US/UkuY/FWoHr/T7vRL8TPxOoBnw+1nT56/ATrGr/+wLnOSibwGnYGXqPEs+/Bh3ZslmbKDeZD9glYrjg7rdQfa5TH6dSQHvTYytEs02pI5zygBzI1BhxYQc8nLx8DA52hfPJyowlFRkw2kudnjgEXLM0iwQLJL0EGQuWHuTQ1jWnd8M/d9+1tNRQ29dRuu//iYeeG5/51oP6HT52yPpq7c++hyrpH2swXnuttfurh+vVPvzfwwz91MdXLbZlLncbFVcUZCYnzSzec2tY92r8iveS+kteFZYvSMqxO45p12iR16cbT2zuf37Vi9X1Sb+YDMGclHVN9NyomohSpVKFI0tiZccoXErPqecEiMGfFcp9YzvQwF7/Zwlz8EBCoANgC1gXzoEnhHJm5I+fEU0O8YvmOUZYCFEwrFY2UhojaF/gEadAxdBzF42WBd3EFqQj8Nd5Da3Lr9A2mgkxCChTCgMLpC+i7F4A6fFgSNSRFGWIYSCYtyUDZJ4lzQ7L09IBWUtAs54FsSUELeosGhdQlhddiZmeRA1PxfumT7TtfOtrYePSlne1Plr4v6mq7GwsLG7tr7+1yLFrk6NpjdzSd8PT1eU40Oe17/9HU2m+z9beaStb0V1f3rymhWG6dvkGukEkQ5mI1tWId07aKl/ymdcxLfqPS1FhpFA4Er+8Zs58w99VVdDiKix0dFXUuw5Fqd8/A2LGGhmNjZNLpeNxoXrJ6d23t7tVLlhc/4XA6T7p7etwnnWFM2BEJk313rgh+NgRqxYEVPePkeNxAxmfSRhAXdRgXGh9VAlHozCZtXEWxiMJmcBYqZNJpx+tufz8Kneux0MjxIjIJWVAAW+4GHS01aINKQANoagxyAUAjTeLcEkqZeGoMeFDJNoiKi7J4XLxAuWUGZjS8eMGAcMWOFx+pwThQkWB1bDE3nKnoaLve2/P60Yb7Bl9+aNl6W+E89Ed+kEyuPO7pTylMvndTeYbF+FRTRcOxsYH+seMrx3Js68v6DwICEwCpZD2wEPoUopK5nJ8NWkwRqhUZJl1iGBRmGDckStNXipJyjd5iDjWVVKlxmZQKRPfEW2/ltexfe/9j1sa8LcZKO2ogEKCb0sWGwc3Wwnte0WY5Gi5KuIibmcVkEnJhGQzduQ5jqEA9u+xUYYOOGnSz6zDoN0VMBykSYjrODelybeZJUeo4D5SEa9Ni5iNjAplLrZVojkrVdY5YJ+qPXXVZ+zq35DtWjrY9+SPrSOeaHw86nYM/PlXdubKgYGVnta2zsaiosZNM1tft8R/f/fpgjSazSPdPS8qePeGsq6857N6713245nrJ6p7Kip7VRkNLr83W22KQZsUoAJPNjsBC2KGQKRlJfjZHxmQq0rGp1JAa0XEwHuRNLpiDKmKmpczr+bJ8iYUkxb4vs97Zknv/4x3LJx7uMm+oKZyYII4ia3bisp0/WBv4O6zdf1Swb60MfMGOTE/DAUnHD+N8WEIJHAykH2B6enpC3IxekOwlsv3hUIxon3SfMYfuj2GliO7fNzHBjgTfE/cumYTFcFbhPVn0v2XNVVV51JA3F93x1MBHGWbvumqpplLH3ZDHueEeWSMXjssMMSOtUQnW0rSnplURtiY6yfJjPLO+uSWv7yel2Ws3byOTs3Me+US8Dy9aek/ixlXmmvwkiNQPmbxD/cRM4W9n/BkpCEdMo9QqRkljw89FRyWFExuG7LzM2w+RyW/bFdRz7AoovCugqdjrpphG3r7rylBz89CVXbuunG5uPn1ll71vlcGwqs9u71ttMKzuI5OhORp6Xg9N2dATMIyK/cxjc2gejrrJzZVtDTVoongtOrJEuZqSZ8zWhFkziEaZXxBMPIoJ9MKOl+lMfXlH+zk6Y881yzP13poeOmN7yGRopDpsAZFtHrA5rodmamjGBmer2B/Wd3NoiW+vLNV30hIWM6/nv6OW2Hv7VUzm1hJSH5FFUk0q3TzeSbyqFTasaOFHw+THZ8o+GTp82ujMLRXa8kvXVuS8/0vj35DJRM0v+eSc6u9XBv5IvD11durXmunPyAXyIZihQ8EvIz3VGOVGhP09IEizMQmMIEiz0SjfP4/RXRFYaZsqglT5UwYIUCTvVUSfEyevVWjmWmUNblUopBCIMdXevH7Juq0LF60QHhx+pXzX8+152/sGyrZ9r9K5ubynb9W6HSMvLG0/u2n3u0343xIz0zmbeWFOaiKblHb60bo9rQaVzlgwnKLXcTZrkWV+Yurje+sHWootRqqDpm+QPuYTWAirFGKXxVxMc0kQaDkPJEsQoHE3aMKAaCV9ICmdaPmdb6GyhzfzAjGJZ9KLlt5j2lncuuLMxud/dvXqBNpFQNxqrC1Oyde9WLDsZ1fRC16UI/6a4vPc9A0mmXhhIdQr+CiX/BzSLLL0BB02mlCIyHgzHyp13swkOw6OrF07cqhpIte2zmRaZ8udQE8PjHaYTB2jA7gwcLNuW4VOV7GtDmupX2kATBLxQhzU3XnmxrihvJ0xwSsgswqZ8RP/Kx7+b6RDul8Tb0CH/4eepQeIaydemA97FM6St0z17LuoGA2jVryLiplSCeNBUaPmggty3gIz0quRHpl1yMz8xPeR+M7tL774WnznN//1uy98+GN/NZ4IGIg3UIj/PTgzBQBym3hBDS4Ff+U1OWb6qBX25phL0jFQQYK0SLtBRTnu4zHp5wSV1GNxoJLvLlRIUCO9Cgk6ZMZnUKc4fesPX6FOcRihz2/+Cd0UtcgpvoY+R78S30J2QMCJXUwV8UK8Ij/JCYsh3xg8VdRFFgDiJBeDF31GE3WFwosaP0PrxfU3URkq+lTswhvx/wU+wvmAYA8AOU+8oALHne9GlRGcx1FXJDocD96OoeA2Py7lQStYkGARyJOBr7DW/yucEvATnuQHnvU+izu8Yf1IvHPrR6XSjehH4gUUSGAeEY3sMCyA1JnvSShR/tkq8KNsa2FaWqE1O9takJpaYGWHo75k038EQJLuPUi8wCneR8fMDrnXVLTl1VLLs/JUX5pKGZY3o4NFTe1VeS2ZprzCPMvEvsZ+R0GS5pKmrIpZ9P8AAAD//wEAAP//mpdoLgAAAAEAAAAHgQaB7SvvXw889QAbB9AAAAAAzhaY5QAAAADQmTqT/Av+Jgq3B8MAAAAHAAIAAAAAAAAAAQAACKT+JgAACxL8C/+rCrcH0AAAAAAAAAAAAAAAAAAAADAEuQCkAhwAAARYAQoDTgCFAhEAWgWoAB4FewC+BfwAcgYzAL4FUwC+BjQAvgJeAL4EzQC+B2AAvgY4AL4GngByBSwAvgVcAL4FSAByBLgAJgUwAAkE4ABfBAMAXwTgAF8EYABfA0wAMQTQAF8EuQCkAhoAegIg/9ICGgCkB2IApAS5AKQExQBfBN8ApATgAF8DWwCkA/MAUgOMADEErACaBCYAFwaKACMEGwAhBEoAEAQRAHMCGgCkAAH9CgIg/9IAAAA2ADYAZgCAALIA+AFuAcwCHAJcAqICxgLyA0gDkAPyBD4EmAUWBUoFiAX8BlIGygc2B5YILAiGCJIIngjCCUwJpgoCCngK8As8C7oMDAxYDI4M5g1ADYANvg3iDg4ORgAAAAEAAAAwAIgABwBbAAUAAQAAAAAACgAAAGQA0QAEAAF4nKSSzWrrRhiGH9nOH0mzK4GUwkBXhViy89OAF4GQkDgNhtQJcelOsseWiDQjpHGMoZv2BnoDhV5EV72Wrktvo2g8Niml5pwcGzHPp3m/9/1mbODQu8Bj8WmCY89WC66xxbeO61zwneMGX640G3zGL443OeBXx1sc87vjbb7gL8c7XHrLrF0OvEvHe294n6+976njNXaAH7yfHFeNfzqusV/73HGdH2tfOW7QWWk2OKz95ngTv/aH4y1Gtb8db/NN/d7xDj/Xl1m7+I264703vE+/0T5utU9EPo3SpIzlSERzcaOVeYx1Lu6UkYUKTaJVmIrbLOr2wuJlIKOHQjd7cpRMMzFotUVfTqZpWLhlTXtnbX+nGuVZFmWilTj3z1qn/5EPWu1mf1K9FkkpQmGKcCSzqtTjdXOv2eqGSslSvGolrrWMC6mOxFVcJKXReSzutYxkkSbqyNpXj3ia51JcyzwsTCaViY3JO0Ewm838sVamevyhzv7ndSCnaRikyVCqUvqxyVKOadHmBEHOlIiUhJIYyQhBxBzBDRqF4ZEYTY7gztaSAkWIIbGKkBTBLRkRXXqEFLwwQBLxQIGmSc86J0zJEAxsuqCPZMKU1Pb8u3pfeucT8jurW3m2KaVLEJzjc0aL0w9wX3g36TNZqYW9XUGIwFAQMkKSrXY143ff9/u6uoQoFNLO9erOeY1GElMgURwhuLJVNb2x7jGCe6uKbEL1v1kol3MsV8ETc3Kk9ZXk9rSGzHobYgyGnA4BATP79Rm77uXqM0STfaQ6QLpfNbATDm1micS3ThnpPwAAAP//AQAA///IDicxAHicYmBmAIP/FgwpDFgAAAAA//8BAAD//yWhAZ+wACsAsgEDAisBsgQDAisBtwQ1KyIYDwAIK7cFOS8lGhAACCu3BjEoHxcOAAgrALcBOi8lGhEACCu3AkU6LyMRAAgrtwM0KyMaEQAIKwCyBwYHK7AAIEV9aRhES7BgUliwARuwAFmwAY4AAAA=");
}
.d2-680017394 .text-bold {
font-family: "d2-680017394-font-bold" !important;
}
@font-face {
font-family: d2-680017394-font-bold;
src: url("data:application/font-woff;base64,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");
}
.d2-680017394 .text-italic {
font-family: "d2-680017394-font-italic" !important;
}
@font-face {
font-family: d2-680017394-font-italic;
src: url("data:application/font-woff;base64,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");
}]]></style><style type="text/css"><![CDATA[.shape {
shape-rendering: geometricPrecision;
stroke-linejoin: round;
}
.connection {
stroke-linecap: round;
stroke-linejoin: round;
}
.blend {
mix-blend-mode: multiply;
opacity: 0.5;
}
.d2-680017394 .fill-N1{fill:#222221;}
.d2-680017394 .fill-N2{fill:#323231;}
.d2-680017394 .fill-N3{fill:#9499AB;}
.d2-680017394 .fill-N4{fill:transparent;}
.d2-680017394 .fill-N5{fill:transparent;}
.d2-680017394 .fill-N6{fill:#EEF1F8;}
.d2-680017394 .fill-N7{fill:#ffffff;}
.d2-680017394 .fill-B1{fill:#777470;}
.d2-680017394 .fill-B2{fill:#777470;}
.d2-680017394 .fill-B3{fill:transparent;}
.d2-680017394 .fill-B4{fill:transparent;}
.d2-680017394 .fill-B5{fill:transparent;}
.d2-680017394 .fill-B6{fill:transparent;}
.d2-680017394 .fill-AA2{fill:#4A6FF3;}
.d2-680017394 .fill-AA4{fill:transparent;}
.d2-680017394 .fill-AA5{fill:transparent;}
.d2-680017394 .fill-AB4{fill:transparent;}
.d2-680017394 .fill-AB5{fill:transparent;}
.d2-680017394 .stroke-N1{stroke:#222221;}
.d2-680017394 .stroke-N2{stroke:#323231;}
.d2-680017394 .stroke-N3{stroke:#9499AB;}
.d2-680017394 .stroke-N4{stroke:transparent;}
.d2-680017394 .stroke-N5{stroke:transparent;}
.d2-680017394 .stroke-N6{stroke:#EEF1F8;}
.d2-680017394 .stroke-N7{stroke:#ffffff;}
.d2-680017394 .stroke-B1{stroke:#777470;}
.d2-680017394 .stroke-B2{stroke:#777470;}
.d2-680017394 .stroke-B3{stroke:transparent;}
.d2-680017394 .stroke-B4{stroke:transparent;}
.d2-680017394 .stroke-B5{stroke:transparent;}
.d2-680017394 .stroke-B6{stroke:transparent;}
.d2-680017394 .stroke-AA2{stroke:#4A6FF3;}
.d2-680017394 .stroke-AA4{stroke:transparent;}
.d2-680017394 .stroke-AA5{stroke:transparent;}
.d2-680017394 .stroke-AB4{stroke:transparent;}
.d2-680017394 .stroke-AB5{stroke:transparent;}
.d2-680017394 .background-color-N1{background-color:#222221;}
.d2-680017394 .background-color-N2{background-color:#323231;}
.d2-680017394 .background-color-N3{background-color:#9499AB;}
.d2-680017394 .background-color-N4{background-color:transparent;}
.d2-680017394 .background-color-N5{background-color:transparent;}
.d2-680017394 .background-color-N6{background-color:#EEF1F8;}
.d2-680017394 .background-color-N7{background-color:#ffffff;}
.d2-680017394 .background-color-B1{background-color:#777470;}
.d2-680017394 .background-color-B2{background-color:#777470;}
.d2-680017394 .background-color-B3{background-color:transparent;}
.d2-680017394 .background-color-B4{background-color:transparent;}
.d2-680017394 .background-color-B5{background-color:transparent;}
.d2-680017394 .background-color-B6{background-color:transparent;}
.d2-680017394 .background-color-AA2{background-color:#4A6FF3;}
.d2-680017394 .background-color-AA4{background-color:transparent;}
.d2-680017394 .background-color-AA5{background-color:transparent;}
.d2-680017394 .background-color-AB4{background-color:transparent;}
.d2-680017394 .background-color-AB5{background-color:transparent;}
.d2-680017394 .color-N1{color:#222221;}
.d2-680017394 .color-N2{color:#323231;}
.d2-680017394 .color-N3{color:#9499AB;}
.d2-680017394 .color-N4{color:transparent;}
.d2-680017394 .color-N5{color:transparent;}
.d2-680017394 .color-N6{color:#EEF1F8;}
.d2-680017394 .color-N7{color:#ffffff;}
.d2-680017394 .color-B1{color:#777470;}
.d2-680017394 .color-B2{color:#777470;}
.d2-680017394 .color-B3{color:transparent;}
.d2-680017394 .color-B4{color:transparent;}
.d2-680017394 .color-B5{color:transparent;}
.d2-680017394 .color-B6{color:transparent;}
.d2-680017394 .color-AA2{color:#4A6FF3;}
.d2-680017394 .color-AA4{color:transparent;}
.d2-680017394 .color-AA5{color:transparent;}
.d2-680017394 .color-AB4{color:transparent;}
.d2-680017394 .color-AB5{color:transparent;}.appendix text.text{fill:#222221}.md{--color-fg-default:#222221;--color-fg-muted:#323231;--color-fg-subtle:#9499AB;--color-canvas-default:#ffffff;--color-canvas-subtle:#EEF1F8;--color-border-default:#777470;--color-border-muted:#777470;--color-neutral-muted:#EEF1F8;--color-accent-fg:#777470;--color-accent-emphasis:#777470;--color-attention-subtle:#323231;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-dark-d2-680017394);mix-blend-mode:overlay}.sketch-overlay-B2{fill:url(#streaks-dark-d2-680017394);mix-blend-mode:overlay}.sketch-overlay-B3{fill:url(#streaks-darker-d2-680017394);mix-blend-mode:lighten}.sketch-overlay-B4{fill:url(#streaks-darker-d2-680017394);mix-blend-mode:lighten}.sketch-overlay-B5{fill:url(#streaks-darker-d2-680017394);mix-blend-mode:lighten}.sketch-overlay-B6{fill:url(#streaks-darker-d2-680017394);mix-blend-mode:lighten}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-680017394);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-darker-d2-680017394);mix-blend-mode:lighten}.sketch-overlay-AA5{fill:url(#streaks-darker-d2-680017394);mix-blend-mode:lighten}.sketch-overlay-AB4{fill:url(#streaks-darker-d2-680017394);mix-blend-mode:lighten}.sketch-overlay-AB5{fill:url(#streaks-darker-d2-680017394);mix-blend-mode:lighten}.sketch-overlay-N1{fill:url(#streaks-darker-d2-680017394);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-darker-d2-680017394);mix-blend-mode:lighten}.sketch-overlay-N3{fill:url(#streaks-normal-d2-680017394);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-darker-d2-680017394);mix-blend-mode:lighten}.sketch-overlay-N5{fill:url(#streaks-darker-d2-680017394);mix-blend-mode:lighten}.sketch-overlay-N6{fill:url(#streaks-bright-d2-680017394);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-680017394);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><style type="text/css">.d2-680017394 .md em,
.d2-680017394 .md dfn {
font-family: "d2-680017394-font-italic" !important;
}
.d2-680017394 .md b,
.d2-680017394 .md strong {
font-family: "d2-680017394-font-bold" !important;
}
.d2-680017394 .md code,
.d2-680017394 .md kbd,
.d2-680017394 .md pre,
.d2-680017394 .md samp {
font-family: "d2-680017394-font-mono" !important;
font-size: 1em;
}
.d2-680017394 .md {
tab-size: 4;
}
/* variables are provided in d2renderers/d2svg/d2svg.go */
.d2-680017394 .md {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
margin: 0;
background-color: transparent; /* we don't want to define the background color */
font-family: "d2-680017394-font-regular" !important;
font-size: 16px;
line-height: 1.5;
word-wrap: break-word;
}
.d2-680017394 .md details,
.d2-680017394 .md figcaption,
.d2-680017394 .md figure {
display: block;
}
.d2-680017394 .md summary {
display: list-item;
}
.d2-680017394 .md [hidden] {
display: none !important;
}
.d2-680017394 .md a {
background-color: transparent;
color: var(--color-accent-fg);
text-decoration: none;
}
.d2-680017394 .md a:active,
.d2-680017394 .md a:hover {
outline-width: 0;
}
.d2-680017394 .md abbr[title] {
border-bottom: none;
text-decoration: underline dotted;
}
.d2-680017394 .md dfn {
font-style: italic;
}
.d2-680017394 .md h1 {
margin: 0.67em 0;
padding-bottom: 0.3em;
font-size: 2em;
border-bottom: 1px solid var(--color-border-muted);
}
.d2-680017394 .md mark {
background-color: var(--color-attention-subtle);
color: var(--color-text-primary);
}
.d2-680017394 .md small {
font-size: 90%;
}
.d2-680017394 .md sub,
.d2-680017394 .md sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
.d2-680017394 .md sub {
bottom: -0.25em;
}
.d2-680017394 .md sup {
top: -0.5em;
}
.d2-680017394 .md img {
border-style: none;
max-width: 100%;
box-sizing: content-box;
background-color: var(--color-canvas-default);
}
.d2-680017394 .md figure {
margin: 1em 40px;
}
.d2-680017394 .md hr {
box-sizing: content-box;
overflow: hidden;
background: transparent;
border-bottom: 1px solid var(--color-border-muted);
height: 0.25em;
padding: 0;
margin: 24px 0;
background-color: var(--color-border-default);
border: 0;
}
.d2-680017394 .md input {
font: inherit;
margin: 0;
overflow: visible;
font-family: inherit;
font-size: inherit;
line-height: inherit;
}
.d2-680017394 .md [type="button"],
.d2-680017394 .md [type="reset"],
.d2-680017394 .md [type="submit"] {
-webkit-appearance: button;
}
.d2-680017394 .md [type="button"]::-moz-focus-inner,
.d2-680017394 .md [type="reset"]::-moz-focus-inner,
.d2-680017394 .md [type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
.d2-680017394 .md [type="button"]:-moz-focusring,
.d2-680017394 .md [type="reset"]:-moz-focusring,
.d2-680017394 .md [type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
.d2-680017394 .md [type="checkbox"],
.d2-680017394 .md [type="radio"] {
box-sizing: border-box;
padding: 0;
}
.d2-680017394 .md [type="number"]::-webkit-inner-spin-button,
.d2-680017394 .md [type="number"]::-webkit-outer-spin-button {
height: auto;
}
.d2-680017394 .md [type="search"] {
-webkit-appearance: textfield;
outline-offset: -2px;
}
.d2-680017394 .md [type="search"]::-webkit-search-cancel-button,
.d2-680017394 .md [type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
.d2-680017394 .md ::-webkit-input-placeholder {
color: inherit;
opacity: 0.54;
}
.d2-680017394 .md ::-webkit-file-upload-button {
-webkit-appearance: button;
font: inherit;
}
.d2-680017394 .md a:hover {
text-decoration: underline;
}
.d2-680017394 .md hr::before {
display: table;
content: "";
}
.d2-680017394 .md hr::after {
display: table;
clear: both;
content: "";
}
.d2-680017394 .md table {
border-spacing: 0;
border-collapse: collapse;
display: block;
width: max-content;
max-width: 100%;
overflow: auto;
}
.d2-680017394 .md td,
.d2-680017394 .md th {
padding: 0;
}
.d2-680017394 .md details summary {
cursor: pointer;
}
.d2-680017394 .md details:not([open]) > *:not(summary) {
display: none !important;
}
.d2-680017394 .md kbd {
display: inline-block;
padding: 3px 5px;
color: var(--color-fg-default);
vertical-align: middle;
background-color: var(--color-canvas-subtle);
border: solid 1px var(--color-neutral-muted);
border-bottom-color: var(--color-neutral-muted);
border-radius: 6px;
box-shadow: inset 0 -1px 0 var(--color-neutral-muted);
}
.d2-680017394 .md h1,
.d2-680017394 .md h2,
.d2-680017394 .md h3,
.d2-680017394 .md h4,
.d2-680017394 .md h5,
.d2-680017394 .md h6 {
margin-top: 24px;
margin-bottom: 16px;
font-weight: 400;
line-height: 1.25;
font-family: "d2-680017394-font-semibold" !important;
}
.d2-680017394 .md h2 {
padding-bottom: 0.3em;
font-size: 1.5em;
border-bottom: 1px solid var(--color-border-muted);
}
.d2-680017394 .md h3 {
font-size: 1.25em;
}
.d2-680017394 .md h4 {
font-size: 1em;
}
.d2-680017394 .md h5 {
font-size: 0.875em;
}
.d2-680017394 .md h6 {
font-size: 0.85em;
color: var(--color-fg-muted);
}
.d2-680017394 .md p {
margin-top: 0;
margin-bottom: 10px;
}
.d2-680017394 .md blockquote {
margin: 0;
padding: 0 1em;
color: var(--color-fg-muted);
border-left: 0.25em solid var(--color-border-default);
}
.d2-680017394 .md ul,
.d2-680017394 .md ol {
margin-top: 0;
margin-bottom: 0;
padding-left: 2em;
}
.d2-680017394 .md ol ol,
.d2-680017394 .md ul ol {
list-style-type: lower-roman;
}
.d2-680017394 .md ul ul ol,
.d2-680017394 .md ul ol ol,
.d2-680017394 .md ol ul ol,
.d2-680017394 .md ol ol ol {
list-style-type: lower-alpha;
}
.d2-680017394 .md dd {
margin-left: 0;
}
.d2-680017394 .md pre {
margin-top: 0;
margin-bottom: 0;
word-wrap: normal;
}
.d2-680017394 .md ::placeholder {
color: var(--color-fg-subtle);
opacity: 1;
}
.d2-680017394 .md input::-webkit-outer-spin-button,
.d2-680017394 .md input::-webkit-inner-spin-button {
margin: 0;
-webkit-appearance: none;
appearance: none;
}
.d2-680017394 .md::before {
display: table;
content: "";
}
.d2-680017394 .md::after {
display: table;
clear: both;
content: "";
}
.d2-680017394 .md > *:first-child {
margin-top: 0 !important;
}
.d2-680017394 .md > *:last-child {
margin-bottom: 0 !important;
}
.d2-680017394 .md a:not([href]) {
color: inherit;
text-decoration: none;
}
.d2-680017394 .md .absent {
color: var(--color-danger-fg);
}
.d2-680017394 .md .anchor {
float: left;
padding-right: 4px;
margin-left: -20px;
line-height: 1;
}
.d2-680017394 .md .anchor:focus {
outline: none;
}
.d2-680017394 .md p,
.d2-680017394 .md blockquote,
.d2-680017394 .md ul,
.d2-680017394 .md ol,
.d2-680017394 .md dl,
.d2-680017394 .md table,
.d2-680017394 .md pre,
.d2-680017394 .md details {
margin-top: 0;
margin-bottom: 16px;
}
.d2-680017394 .md blockquote > :first-child {
margin-top: 0;
}
.d2-680017394 .md blockquote > :last-child {
margin-bottom: 0;
}
.d2-680017394 .md sup > a::before {
content: "[";
}
.d2-680017394 .md sup > a::after {
content: "]";
}
.d2-680017394 .md h1:hover .anchor,
.d2-680017394 .md h2:hover .anchor,
.d2-680017394 .md h3:hover .anchor,
.d2-680017394 .md h4:hover .anchor,
.d2-680017394 .md h5:hover .anchor,
.d2-680017394 .md h6:hover .anchor {
text-decoration: none;
}
.d2-680017394 .md h1 tt,
.d2-680017394 .md h1 code,
.d2-680017394 .md h2 tt,
.d2-680017394 .md h2 code,
.d2-680017394 .md h3 tt,
.d2-680017394 .md h3 code,
.d2-680017394 .md h4 tt,
.d2-680017394 .md h4 code,
.d2-680017394 .md h5 tt,
.d2-680017394 .md h5 code,
.d2-680017394 .md h6 tt,
.d2-680017394 .md h6 code {
padding: 0 0.2em;
font-size: inherit;
}
.d2-680017394 .md ul.no-list,
.d2-680017394 .md ol.no-list {
padding: 0;
list-style-type: none;
}
.d2-680017394 .md ol[type="1"] {
list-style-type: decimal;
}
.d2-680017394 .md ol[type="a"] {
list-style-type: lower-alpha;
}
.d2-680017394 .md ol[type="i"] {
list-style-type: lower-roman;
}
.d2-680017394 .md div > ol:not([type]) {
list-style-type: decimal;
}
.d2-680017394 .md ul ul,
.d2-680017394 .md ul ol,
.d2-680017394 .md ol ol,
.d2-680017394 .md ol ul {
margin-top: 0;
margin-bottom: 0;
}
.d2-680017394 .md li > p {
margin-top: 16px;
}
.d2-680017394 .md li + li {
margin-top: 0.25em;
}
.d2-680017394 .md dl {
padding: 0;
}
.d2-680017394 .md dl dt {
padding: 0;
margin-top: 16px;
font-size: 1em;
font-style: italic;
font-family: "d2-680017394-font-semibold" !important;
}
.d2-680017394 .md dl dd {
padding: 0 16px;
margin-bottom: 16px;
}
.d2-680017394 .md table th {
font-family: "d2-680017394-font-semibold" !important;
}
.d2-680017394 .md table th,
.d2-680017394 .md table td {
padding: 6px 13px;
border: 1px solid var(--color-border-default);
}
.d2-680017394 .md table tr {
background-color: var(--color-canvas-default);
border-top: 1px solid var(--color-border-muted);
}
.d2-680017394 .md table tr:nth-child(2n) {
background-color: var(--color-canvas-subtle);
}
.d2-680017394 .md table img {
background-color: transparent;
}
.d2-680017394 .md img[align="right"] {
padding-left: 20px;
}
.d2-680017394 .md img[align="left"] {
padding-right: 20px;
}
.d2-680017394 .md span.frame {
display: block;
overflow: hidden;
}
.d2-680017394 .md span.frame > span {
display: block;
float: left;
width: auto;
padding: 7px;
margin: 13px 0 0;
overflow: hidden;
border: 1px solid var(--color-border-default);
}
.d2-680017394 .md span.frame span img {
display: block;
float: left;
}
.d2-680017394 .md span.frame span span {
display: block;
padding: 5px 0 0;
clear: both;
color: var(--color-fg-default);
}
.d2-680017394 .md span.align-center {
display: block;
overflow: hidden;
clear: both;
}
.d2-680017394 .md span.align-center > span {
display: block;
margin: 13px auto 0;
overflow: hidden;
text-align: center;
}
.d2-680017394 .md span.align-center span img {
margin: 0 auto;
text-align: center;
}
.d2-680017394 .md span.align-right {
display: block;
overflow: hidden;
clear: both;
}
.d2-680017394 .md span.align-right > span {
display: block;
margin: 13px 0 0;
overflow: hidden;
text-align: right;
}
.d2-680017394 .md span.align-right span img {
margin: 0;
text-align: right;
}
.d2-680017394 .md span.float-left {
display: block;
float: left;
margin-right: 13px;
overflow: hidden;
}
.d2-680017394 .md span.float-left span {
margin: 13px 0 0;
}
.d2-680017394 .md span.float-right {
display: block;
float: right;
margin-left: 13px;
overflow: hidden;
}
.d2-680017394 .md span.float-right > span {
display: block;
margin: 13px auto 0;
overflow: hidden;
text-align: right;
}
.d2-680017394 .md code,
.d2-680017394 .md tt {
padding: 0.2em 0.4em;
margin: 0;
font-size: 85%;
background-color: var(--color-neutral-muted);
border-radius: 6px;
}
.d2-680017394 .md code br,
.d2-680017394 .md tt br {
display: none;
}
.d2-680017394 .md del code {
text-decoration: inherit;
}
.d2-680017394 .md pre code {
font-size: 100%;
}
.d2-680017394 .md pre > code {
padding: 0;
margin: 0;
word-break: normal;
white-space: pre;
background: transparent;
border: 0;
}
.d2-680017394 .md .highlight {
margin-bottom: 16px;
}
.d2-680017394 .md .highlight pre {
margin-bottom: 0;
word-break: normal;
}
.d2-680017394 .md .highlight pre,
.d2-680017394 .md pre {
padding: 16px;
overflow: auto;
font-size: 85%;
line-height: 1.45;
background-color: var(--color-canvas-subtle);
border-radius: 6px;
}
.d2-680017394 .md pre code,
.d2-680017394 .md pre tt {
display: inline;
max-width: auto;
padding: 0;
margin: 0;
overflow: visible;
line-height: inherit;
word-wrap: normal;
background-color: transparent;
border: 0;
}
.d2-680017394 .md .csv-data td,
.d2-680017394 .md .csv-data th {
padding: 5px;
overflow: hidden;
font-size: 12px;
line-height: 1;
text-align: left;
white-space: nowrap;
}
.d2-680017394 .md .csv-data .blob-num {
padding: 10px 8px 9px;
text-align: right;
background: var(--color-canvas-default);
border: 0;
}
.d2-680017394 .md .csv-data tr {
border-top: 0;
}
.d2-680017394 .md .csv-data th {
font-family: "d2-680017394-font-semibold" !important;
background: var(--color-canvas-subtle);
border-top: 0;
}
.d2-680017394 .md .footnotes {
font-size: 12px;
color: var(--color-fg-muted);
border-top: 1px solid var(--color-border-default);
}
.d2-680017394 .md .footnotes ol {
padding-left: 16px;
}
.d2-680017394 .md .footnotes li {
position: relative;
}
.d2-680017394 .md .footnotes li:target::before {
position: absolute;
top: -8px;
right: -8px;
bottom: -8px;
left: -24px;
pointer-events: none;
content: "";
border: 2px solid var(--color-accent-emphasis);
border-radius: 6px;
}
.d2-680017394 .md .footnotes li:target {
color: var(--color-fg-default);
}
.d2-680017394 .md .task-list-item {
list-style-type: none;
}
.d2-680017394 .md .task-list-item label {
font-weight: 400;
}
.d2-680017394 .md .task-list-item.enabled label {
cursor: pointer;
}
.d2-680017394 .md .task-list-item + .task-list-item {
margin-top: 3px;
}
.d2-680017394 .md .task-list-item .handle {
display: none;
}
.d2-680017394 .md .task-list-item-checkbox {
margin: 0 0.2em 0.25em -1.6em;
vertical-align: middle;
}
.d2-680017394 .md .contains-task-list:dir(rtl) .task-list-item-checkbox {
margin: 0 -1.6em 0.25em 0.2em;
}
</style><g class="ZGlhZ3JhbQ=="><g class="shape" ><rect x="200.000000" y="0.000000" width="1044.000000" height="1399.000000" stroke="#777470" fill="#ffffff" class=" stroke-B1 fill-N7" style="stroke-width:0;" /></g></g><g class="dG9vbHRpcCAx"><g class="shape" ></g><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="0.000000" y="880.000000" width="241" height="24"><div xmlns="http://www.w3.org/1999/xhtml" class="md color-N1"><p>Loading assets and third-party</p>
</div></foreignObject></g></g><g class="dG9vbHRpcCAy"><g class="shape" ></g><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="25.000000" y="900.000000" width="196" height="24"><div xmlns="http://www.w3.org/1999/xhtml" class="md color-N1"><p>scripts during this time. a</p>
</div></foreignObject></g></g><g class="ZGlhZ3JhbS5icm93c2Vy heading with icon"><g class="shape" ><rect x="212.000000" y="54.000000" width="160.000000" height="92.000000" stroke="#777470" fill="transparent" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><image href="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTIuMjUgNmEzIDMgMCAwMTMtM2gxMy41YTMgMyAwIDAxMyAzdjEyYTMgMyAwIDAxLTMgM0g1LjI1YTMgMyAwIDAxLTMtM1Y2em0zLTEuNUExLjUgMS41IDAgMDAzLjc1IDZ2MS41aDE2LjVWNmExLjUgMS41IDAgMDAtMS41LTEuNUg1LjI1em0xNSA0LjVIMy43NXY5YTEuNSAxLjUgMCAwMDEuNSAxLjVoMTMuNWExLjUgMS41IDAgMDAxLjUtMS41Vjl6TTQuNSA2YS43NS43NSAwIDAxLjc1LS43NWguMDA4YS43NS43NSAwIDAxLjc1Ljc1di4wMDhhLjc1Ljc1IDAgMDEtLjc1Ljc1SDUuMjVhLjc1Ljc1IDAgMDEtLjc1LS43NVY2em0yLjI1IDBhLjc1Ljc1IDAgMDEuNzUtLjc1aC4wMDhhLjc1Ljc1IDAgMDEuNzUuNzV2LjAwOGEuNzUuNzUgMCAwMS0uNzUuNzVINy41YS43NS43NSAwIDAxLS43NS0uNzVWNnpNOSA2YS43NS43NSAwIDAxLjc1LS43NWguMDA4YS43NS43NSAwIDAxLjc1Ljc1di4wMDhhLjc1Ljc1IDAgMDEtLjc1Ljc1SDkuNzVhLjc1Ljc1IDAgMDEtLjc1LS43NVY2eiIgZmlsbD0iIzE0MTQxMyIvPgo8L3N2Zz4K" x="269.000000" y="95.000000" width="46" height="46" /><text x="292.000000" y="75.000000" fill="#222221" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">Browser</text></g><g class="ZGlhZ3JhbS5zZXJ2ZXI= heading with icon"><g class="shape" ><rect x="455.000000" y="52.000000" width="179.000000" height="94.000000" stroke="#777470" fill="transparent" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><image href="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTguNDM4IDQuNWMtLjgyNyAwLTEuNjA1LjM4OS0yLjEgMS4wNUw0Ljg2IDcuNTJjLjEyOC0uMDEzLjI1OC0uMDIuMzktLjAyaDEzLjVjLjEzMiAwIC4yNjIuMDA3LjM5LjAybC0xLjQ3Ny0xLjk3YTIuNjI1IDIuNjI1IDAgMDAtMi4xLTEuMDVIOC40MzZ6TTIxIDExLjI1QTIuMjUgMi4yNSAwIDAwMTguNzUgOUg1LjI1YTIuMjUgMi4yNSAwIDAwMCA0LjVoMTMuNUEyLjI1IDIuMjUgMCAwMDIxIDExLjI1em0wIDNhMy43NDQgMy43NDQgMCAwMDEuNS0zIDUuMjUgNS4yNSAwIDAwLTEuMDUtMy4xNWwtMi41ODctMy40NS0uNi40NS42LS40NWE0LjEyNSA0LjEyNSAwIDAwLTMuMy0xLjY1SDguNDM2YTQuMTI1IDQuMTI1IDAgMDAtMy4zIDEuNjVMMi41NSA4LjFhNS4yNSA1LjI1IDAgMDAtMS4wNSAzLjE1YzAgMS4yMjcuNTg5IDIuMzE2IDEuNSAzQTMuNzUgMy43NSAwIDAwNS4yNSAyMWgxMy41QTMuNzUgMy43NSAwIDAwMjEgMTQuMjV6TTUuMjUgMTVhMi4yNSAyLjI1IDAgMDAwIDQuNWgxMy41YTIuMjUgMi4yNSAwIDAwMC00LjVINS4yNXpNMTUgMTEuMjVhLjc1Ljc1IDAgMDEuNzUtLjc1aC4wMDhhLjc1Ljc1IDAgMDEuNzUuNzV2LjAwOGEuNzUuNzUgMCAwMS0uNzUuNzVoLS4wMDhhLjc1Ljc1IDAgMDEtLjc1LS43NXYtLjAwOHptMyAwYS43NS43NSAwIDAxLjc1LS43NWguMDA4YS43NS43NSAwIDAxLjc1Ljc1di4wMDhhLjc1Ljc1IDAgMDEtLjc1Ljc1aC0uMDA4YS43NS43NSAwIDAxLS43NS0uNzV2LS4wMDh6bS0zIDZhLjc1Ljc1IDAgMDEuNzUtLjc1aC4wMDhhLjc1Ljc1IDAgMDEuNzUuNzV2LjAwOGEuNzUuNzUgMCAwMS0uNzUuNzVoLS4wMDhhLjc1Ljc1IDAgMDEtLjc1LS43NXYtLjAwOHptMyAwYS43NS43NSAwIDAxLjc1LS43NWguMDA4YS43NS43NSAwIDAxLjc1Ljc1di4wMDhhLjc1Ljc1IDAgMDEtLjc1Ljc1aC0uMDA4YS43NS43NSAwIDAxLS43NS0uNzV2LS4wMDh6IiBmaWxsPSIjMTQxNDEzIi8+Cjwvc3ZnPgo=" x="521.000000" y="94.000000" width="47" height="47" /><text x="544.500000" y="73.000000" fill="#222221" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">Next.js Server</text></g><g class="ZGlhZ3JhbS5lY29t heading with icon"><g class="shape" ><rect x="674.000000" y="52.000000" width="244.000000" height="94.000000" stroke="#777470" fill="transparent" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><image href="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTEuNSAzYS43NS43NSAwIDAxLjc1LS43NWgxLjM4NmMuODUgMCAxLjU5My41NzEgMS44MTEgMS4zOTJsLjIzMi44NjdhNjAuODY0IDYwLjg2NCAwIDAxMTYuMTQ5IDEuODc3Ljc1Ljc1IDAgMDEuNTI1Ljk2NSA2MC4zNTggNjAuMzU4IDAgMDEtMi45NiA3LjIyOC43NS43NSAwIDAxLS42NzUuNDIxSDcuNWEyLjI1IDIuMjUgMCAwMC0yLjEyMiAxLjVIMjAuMjVhLjc1Ljc1IDAgMDEwIDEuNUg0LjVhLjc1Ljc1IDAgMDEtLjc1LS43NSAzLjc1MiAzLjc1MiAwIDAxMi44MDYtMy42M0w0LjM4IDUuNDY1bC0uMzgzLTEuNDM3YS4zNzUuMzc1IDAgMDAtLjM2Mi0uMjc4SDIuMjVBLjc1Ljc1IDAgMDExLjUgM3ptNC41NzcgMy4wMDRsMiA3LjQ5NmgxMC4xN2E1OC44ODYgNTguODg2IDAgMDAyLjQyLTUuODU3IDU5LjQwNiA1OS40MDYgMCAwMC0xNC41OS0xLjY0ek0zLjc1IDIwLjI1YTEuNSAxLjUgMCAxMTMgMCAxLjUgMS41IDAgMDEtMyAwem0xMi43NSAwYTEuNSAxLjUgMCAxMTMgMCAxLjUgMS41IDAgMDEtMyAweiIgZmlsbD0iIzE0MTQxMyIvPgo8L3N2Zz4K" x="772.500000" y="94.000000" width="47" height="47" /><text x="796.000000" y="73.000000" fill="#222221" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">E-commerce Platform</text></g><g class="ZGlhZ3JhbS5keQ== heading with icon"><g class="shape" ><rect x="958.000000" y="52.000000" width="274.000000" height="94.000000" stroke="#777470" fill="transparent" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><image href="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8dGl0bGU+CiAgICBJY29ucyAvIE1hc3RlcmNhcmQgLyBCdXNpbmVzcyBUZWNoICZhbXA7IFRyYW5zYWN0aW9ucyAvIHBlcnNvbmFsaXphdGlvbiAxCiAgPC90aXRsZT4KICA8cGF0aCBkPSJNNyAxN3Y1SDZ2LTMuMjkzbC01IDVMLjI5MyAyM2w1LTVIMnYtMWg1em0xNSAwdjFoLTMuMjkzbDUgNS0uNzA3LjcwNy01LTVWMjJoLTF2LTVoNXptLTcuNTM0LTYuOTc0YS42NC42NCAwIDAxLjcyNS4yNzdsMi44ODkgNC42MjItLjg0OS41M0wxNSAxMS44ODVWMThIOXYtNi4xMTVsLTIuMjMyIDMuNTctLjg0OC0uNTMgMi44ODktNC42MjFhLjY0My42NDMgMCAwMTEuMTkxLjM0MVYxN2g0di02LjM1NWMwLS4yOTEuMTg4LS41NC40NjYtLjYxOXpNMTIgNWMxLjI0MSAwIDIuMjUgMS4wMSAyLjI1IDIuMjVTMTMuMjQxIDkuNSAxMiA5LjVhMi4yNTMgMi4yNTMgMCAwMS0yLjI1LTIuMjVDOS43NSA2LjAxIDEwLjc1OSA1IDEyIDV6bTAgMWMtLjY4OSAwLTEuMjUuNTYxLTEuMjUgMS4yNVMxMS4zMTEgOC41IDEyIDguNXMxLjI1LS41NjEgMS4yNS0xLjI1UzEyLjY4OSA2IDEyIDZ6TTIzIC4yOTNsLjcwNy43MDctNSA1SDIydjFoLTVWMmgxdjMuMjkzbDUtNXptLTIyIDBsNSA1VjJoMXY1SDJWNmgzLjI5M2wtNS01TDEgLjI5M3oiIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1ydWxlPSJldmVub2RkIi8+Cjwvc3ZnPgo=" x="1071.500000" y="94.000000" width="47" height="47" /><text x="1095.000000" y="73.000000" fill="#222221" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">Mastercard Dynamic Yield</text></g><g class="KGRpYWdyYW0uYnJvd3NlciAtLSApWzBd"><path d="M 292.000000 148.000000 L 292.000000 1386.000000" stroke="#777470" fill="none" class="connection stroke-B2" style="stroke-width:2;stroke-dasharray:12.000000,11.838767;" mask="url(#d2-680017394)" /></g><g class="KGRpYWdyYW0uc2VydmVyIC0tIClbMF0="><path d="M 544.500000 148.000000 L 544.500000 1386.000000" stroke="#777470" fill="none" class="connection stroke-B2" style="stroke-width:2;stroke-dasharray:12.000000,11.838767;" mask="url(#d2-680017394)" /></g><g class="KGRpYWdyYW0uZWNvbSAtLSApWzBd"><path d="M 796.000000 148.000000 L 796.000000 1386.000000" stroke="#777470" fill="none" class="connection stroke-B2" style="stroke-width:2;stroke-dasharray:12.000000,11.838767;" mask="url(#d2-680017394)" /></g><g class="KGRpYWdyYW0uZHkgLS0gKVswXQ=="><path d="M 1095.000000 148.000000 L 1095.000000 1386.000000" stroke="#777470" fill="none" class="connection stroke-B2" style="stroke-width:2;stroke-dasharray:12.000000,11.838767;" mask="url(#d2-680017394)" /></g><g class="ZGlhZ3JhbS5zZXJ2ZXIucmVxdWVzdA=="><g class="shape" ><rect x="538.000000" y="239.000000" width="12.000000" height="851.000000" stroke="#777470" fill="#e8e5e1" class=" stroke-B1" style="stroke-width:2;" /></g></g><g class="ZGlhZ3JhbS5icm93c2VyLnJlbmRlcmluZw=="><g class="shape" ><rect x="286.000000" y="525.000000" width="12.000000" height="721.000000" stroke="#777470" fill="#e8e5e1" class=" stroke-B1" style="stroke-width:2;" /></g></g><g class="ZGlhZ3JhbS5zZXJ2ZXIucmVxdWVzdC5pbml0"><g class="shape" ><rect x="534.000000" y="249.000000" width="20.000000" height="296.000000" stroke="#777470" fill="#e8e5e1" class=" stroke-B1" style="stroke-width:2;" /></g></g><g class="ZGlhZ3JhbS5Jbml0aWFsIEhUTUwgcmVzcG9uc2U="><g class="shape blend" ><rect x="252.000000" y="204.000000" width="883.000000" height="354.000000" stroke="#777470" fill="#f3f0ee" class=" stroke-B1" style="stroke-width:0;" /></g><rect x="257.000000" y="209.000000" width="166.000000" height="22.000000" fill="#f3f0ee" /><text x="340.000000" y="225.000000" fill="#222221" class="text fill-N1" style="text-anchor:middle;font-size:16px">Initial HTML response</text></g><g class="ZGlhZ3JhbS4oYnJvd3NlciAtJmd0OyBzZXJ2ZXIucmVxdWVzdC5pbml0KVswXQ=="><marker id="mk-d2-680017394-499067918" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#f37338" class="connection" stroke-width="2" /> </marker><path d="M 294.000000 259.000000 L 530.500000 259.000000" stroke="#f37338" fill="none" class="connection" style="stroke-width:2;" marker-end="url(#mk-d2-680017394-499067918)" mask="url(#d2-680017394)" /><text x="413.500000" y="264.000000" fill="#f37338" class="text-italic" style="text-anchor:middle;font-size:16px">Request</text></g><g class="ZGlhZ3JhbS4oc2VydmVyLnJlcXVlc3QuaW5pdCAtJmd0OyBlY29tKVswXQ=="><path d="M 556.500000 351.000000 L 792.000000 351.000000" stroke="#f37338" fill="none" class="connection" style="stroke-width:2;" marker-end="url(#mk-d2-680017394-499067918)" mask="url(#d2-680017394)" /><text x="675.000000" y="356.000000" fill="#f37338" class="text-italic" style="text-anchor:middle;font-size:16px">Initiate cart read API call</text></g><g class="ZGlhZ3JhbS4oc2VydmVyLnJlcXVlc3QuaW5pdCAtJmd0OyBkeSlbMF0="><path d="M 556.500000 443.000000 L 1091.000000 443.000000" stroke="#f37338" fill="none" class="connection" style="stroke-width:2;" marker-end="url(#mk-d2-680017394-499067918)" mask="url(#d2-680017394)" /><text x="825.000000" y="448.000000" fill="#f37338" class="text-italic" style="text-anchor:middle;font-size:16px">Initiate "Choose" API call</text></g><g class="ZGlhZ3JhbS4oc2VydmVyLnJlcXVlc3QuaW5pdCAtJmd0OyBicm93c2VyLnJlbmRlcmluZylbMF0="><path d="M 532.500000 535.000000 L 302.000000 535.000000" stroke="#f37338" fill="none" class="connection" style="stroke-width:2;" marker-end="url(#mk-d2-680017394-499067918)" mask="url(#d2-680017394)" /><text x="416.500000" y="540.000000" fill="#f37338" class="text-italic" style="text-anchor:middle;font-size:16px">Static and cached HTML</text></g><g class="ZGlhZ3JhbS4oZHkgLSZndDsgc2VydmVyLnJlcXVlc3QpWzBd"><path d="M 1093.000000 780.000000 L 554.500000 780.000000" stroke="#f37338" fill="none" class="connection" style="stroke-width:2;" marker-end="url(#mk-d2-680017394-499067918)" mask="url(#d2-680017394)" /><text x="822.500000" y="785.000000" fill="#f37338" class="text-italic" style="text-anchor:middle;font-size:16px">"Choose" API response</text></g><g class="ZGlhZ3JhbS4oc2VydmVyLnJlcXVlc3QgLSZndDsgYnJvd3Nlci5yZW5kZXJpbmcpWzBd"><path d="M 536.500000 880.000000 L 302.000000 880.000000" stroke="#f37338" fill="none" class="connection" style="stroke-width:2;" marker-end="url(#mk-d2-680017394-499067918)" mask="url(#d2-680017394)" /><text x="418.000000" y="877.000000" fill="#f37338" class="text-italic" style="text-anchor:middle;font-size:16px"><tspan x="418.000000" dy="0.000000">React Server Component</tspan><tspan x="418.000000" dy="19.000000">with personalized data</tspan></text></g><g class="ZGlhZ3JhbS4oZWNvbSAtJmd0OyBzZXJ2ZXIucmVxdWVzdClbMF0="><path d="M 794.000000 980.000000 L 554.500000 980.000000" stroke="#f37338" fill="none" class="connection" style="stroke-width:2;" marker-end="url(#mk-d2-680017394-499067918)" mask="url(#d2-680017394)" /><text x="673.500000" y="985.000000" fill="#f37338" class="text-italic" style="text-anchor:middle;font-size:16px">Cart read API response</text></g><g class="ZGlhZ3JhbS4oc2VydmVyLnJlcXVlc3QgLSZndDsgYnJvd3Nlci5yZW5kZXJpbmcpWzFd"><path d="M 536.500000 1080.000000 L 302.000000 1080.000000" stroke="#f37338" fill="none" class="connection" style="stroke-width:2;" marker-end="url(#mk-d2-680017394-499067918)" mask="url(#d2-680017394)" /><text x="418.000000" y="1077.000000" fill="#f37338" class="text-italic" style="text-anchor:middle;font-size:16px"><tspan x="418.000000" dy="0.000000">React Server Component</tspan><tspan x="418.000000" dy="19.000000">with cart data</tspan></text></g><g class="ZGlhZ3JhbS4oYnJvd3NlciAmbHQ7LSZndDsgc2VydmVyKVswXQ=="><marker id="mk-d2-680017394-2932033717" markerWidth="10.000000" markerHeight="12.000000" refX="3.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="10.000000,0.000000 0.000000,6.000000 10.000000,12.000000" fill="#f37338" class="connection" stroke-width="2" /> </marker><path d="M 296.000000 1317.000000 L 540.500000 1317.000000" stroke="#f37338" fill="none" class="connection" style="stroke-width:2;" marker-start="url(#mk-d2-680017394-2932033717)" marker-end="url(#mk-d2-680017394-499067918)" mask="url(#d2-680017394)" /><text x="418.000000" y="1322.000000" fill="#f37338" class="text-italic" style="text-anchor:middle;font-size:16px">Other requests</text></g><g class="ZGlhZ3JhbS5icm93c2VyLnJlbmRlcmluZy4mIzM0O1N0YXJ0IHBhZ2UgcmVuZGVyaW5nXG53aXRoIGZpcnN0IGNvbnRlbnRmdWwgcGFpbnQmIzM0Ow=="><g class="shape" ><path d="M 170 616 H 394 C 395 616 396 616 397 617 L 414 633 C 415 634 415 635 415 636 V 699 C 415 699 415 699 415 699 H 170 C 169 699 169 699 169 699 V 617 C 169 616 169 616 170 616 Z" stroke="#777470" fill="#ffffff" class=" stroke-B1 fill-N7" style="stroke-width:2;" /><path d="M 414 699 H 170 C 169 699 169 699 169 698 V 617 C 169 616 169 616 170 616 H 393 C 394 616 394 616 394 617 V 634 C 394 635 395 636 396 636 H 414 C 415 636 415 636 415 637 V 698 C 414 699 415 699 414 699 Z" stroke="#777470" fill="#ffffff" class=" stroke-B1 fill-N7" style="stroke-width:2;" /></g><text x="292.000000" y="654.500000" fill="#222221" class="text fill-N1" style="text-anchor:middle;font-size:16px"><tspan x="292.000000" dy="0.000000">Start page rendering</tspan><tspan x="292.000000" dy="19.000000">with first contentful paint</tspan></text></g><g class="ZGlhZ3JhbS5icm93c2VyLnJlbmRlcmluZy5Db21wbGV0ZSBwYWdlIHJlbmRlcmluZw=="><g class="shape" ><path d="M 172 1169 H 391 C 392 1169 393 1169 394 1170 L 411 1186 C 412 1187 412 1188 412 1189 V 1236 C 412 1236 412 1236 412 1236 H 172 C 171 1236 171 1236 171 1236 V 1170 C 171 1169 171 1169 172 1169 Z" stroke="#777470" fill="#ffffff" class=" stroke-B1 fill-N7" style="stroke-width:2;" /><path d="M 411 1236 H 172 C 171 1236 171 1236 171 1235 V 1170 C 171 1169 171 1169 172 1169 H 390 C 391 1169 391 1169 391 1170 V 1187 C 391 1188 392 1189 393 1189 H 411 C 412 1189 412 1189 412 1190 V 1235 C 411 1236 412 1236 411 1236 Z" stroke="#777470" fill="#ffffff" class=" stroke-B1 fill-N7" style="stroke-width:2;" /></g><text x="291.500000" y="1207.500000" fill="#222221" class="text fill-N1" style="text-anchor:middle;font-size:16px">Complete page rendering</text></g><mask id="d2-680017394" maskUnits="userSpaceOnUse" x="-11" y="-10" width="1265" height="1419">
<rect x="-11" y="-10" width="1265" height="1419" fill="white"></rect>
<rect x="380.000000" y="248.000000" width="67" height="22" fill="black"></rect>
<rect x="579.000000" y="340.000000" width="192" height="22" fill="black"></rect>
<rect x="728.000000" y="432.000000" width="194" height="22" fill="black"></rect>
<rect x="321.000000" y="524.000000" width="191" height="22" fill="black"></rect>
<rect x="735.000000" y="769.000000" width="175" height="22" fill="black"></rect>
<rect x="320.000000" y="861.000000" width="196" height="38" fill="black"></rect>
<rect x="584.000000" y="969.000000" width="179" height="22" fill="black"></rect>
<rect x="320.000000" y="1061.000000" width="196" height="38" fill="black"></rect>
<rect x="359.000000" y="1306.000000" width="118" height="22" fill="black"></rect>
</mask></svg>The differences between partial prerendering and fetching data from the client-side include:
The request for the data is initiated very early, as soon as the server knows it will be needed, compared to client-side which only initiates it after the browser renders the server’s response and hydrates the components. This also means that the data is available earlier, often dozens or even hundreds of milliseconds. With a large page and a small component, the component’s data may arrive before its hydration.
The fetching of the data is server-to-server which can lower latency and overheads especially for the first pageview and for devices with worse network connections.
API keys and secrets are not exposed to the browser.[2]
Cache Components are not enabled by default and enabling them requires annotation changes to existing layouts and pages. See Enabling Cache Components in the Next.js documentation.
Code example
With Cache Components, this is straightforward to implement. Observe this function that fetches campaign data from Dynamic Yield.
The key elements here are:
<RecsWidget /> is a dynamic server-side component that includes a recommendations widget, which will stream to the browser when its data is ready. It looks like a standard React Server Component.
Home is a page to be rendered synchronously. It will only include static HTML/JSX elements, and <Suspense /> components as seen to load dynamic components (optionally cached). Here it uses <Suspense /> to load <RecsWidget /> and specifies what would be the fallback content as it loads. In real-life, the fallback content would be of similar properties to the final content: similar dimensions, similar visual shape or perhaps blank.
The Dynamic Yield identifiers management and the <SetDyIds /> component are explained in the “Implementing Mastercard Dynamic Yield’s Experience API in Next.js 16” article. Contact your technical account manager for more information.
export interface DyCookieResponse { name: string; value: string; maxAge: string; } async function getDyCookies() { const cookieStore = await cookies(); const dyId = cookieStore.get('_dyid')?.value ?? ''; const dyIdServer = cookieStore.get('_dyid_server')?.value ?? ''; const dySession = cookieStore.get('_dyjsession')?.value ?? ''; return { dyId, dyIdServer, dySession }; } async function fetchDyData(selectors: string[]) { // Ensure this function can't be included in the client-side bundle with the API key 'use server'; const { dyId, dyIdServer, dySession } = await getDyCookies(); const url = 'https://dy-api.com/v2/serve/user/choose'; const options = { method: 'POST', headers: { accept: 'application/json', 'content-type': 'application/json', 'dy-api-key': process.env.DY_API_KEY, }, body: JSON.stringify({ user: { dyid: dyId, dyid_server: dyIdServer }, session: { dy: dySession }, context: { // ... }, selector: { names: selectors }, }) }; const response = await fetch(url, options); const result = await response.json(); const newCookies: DyCookieResponse[] = result.cookies ?? []; const dyidServerCookie = newCookies.find((cookie: { name: string }) => cookie.name === '_dyid_server'); const dyjsessionCookie = newCookies.find((cookie: { name: string }) => cookie.name === '_dyjsession'); return { dyid: dyidServerCookie, dyjsession: dyjsessionCookie, choices: result.choices }; } type Slot = { sku: string; productData: { name: string; price: string; }; }; export async function RecsWidget() { const { dyid, dyjsession, choices } = await fetchDyData(["Homepage Trending Products"]); const choice = choices?.[0].variations?.[0].payload.data as { slots: Slot[] } | undefined; return <> {dyid && dyjsession && <SetDyIds dyid={dyid} dyjsession={dyjsession} />} <ul> {choice && choice.slots.map(({ sku, productData }, index: number) => ( <li key={index}> <strong>{productData.name}</strong> (SKU: {sku}) - ${productData.price} </li> ))} </ul> </>; } export default async function Home() { return ( <div className={styles.page}> <main className={styles.main}> <Suspense fallback={<div>Loading dynamic content...</div>}> <RecsWidget /> </Suspense> ...
This feature is widely supported in most hosting setups, including Vercel, Netlify, and self-hosting. Cloudflare Workers (not as a CDN over Vercel or another system, but as an independent host) does not support this feature currently. ↑
It is advised to add an inline
'use server'at the top of every function that interacts with an API key or a secret, to prevent accidental inclusion of the code and references in the client-side bundle. ↑