Shopstory is just a CMS field, it can be added anywhere within your content model.
Under the hood Shopstory data is standard CMS data so all the 3rd party tools for A/B testing, translations etc. will work with Shopstory content.
Shopstory data is stored within CMS data as standard CMS fields, therefore it’s available via ultrafast APIs and CDNs.
Shopstory uses native CMS media picker, keep all media in one place.
Read about Ace & Tate's journey from form-based CMS to visual building with Shopstory.
Case Studynext.js example
Contentful allows developers to write custom applications that works inside of the Contentful. To do this, they must use Contentful App Framework described here https://www.contentful.com/app-framework/. Shopstory is just a Contentful app that adds a new field type - a visual builder.
Inside of the Contentful data. We don't have our own servers or CDNs. You can fetch Shopstory managed data with standard Contentful API calls in the way way as you would fetch any other Contentful data.
The algorithm is pretty simple:
With Shopstory in use most cases you won't have to code content blocks at all. Around 80-90% of content needs can be covered with our out-of-the-box library. We believe this is a game changer. From now on content team can add new content blocks, add variants, make modifications without falling into development cycle at all. This helps developers too, they have more time to focus on other stuff and less code to maintain.
We know this one very well, as an ecommerce agency we had this issue all the time.
We know how important are Web Vitals for modern web. Shopstory won't affect them negatively and actually in many cases it can make the score even higher.
Although Shopstory provides hundreds of content blocks out-of-the-box, they aren't kept in your JS bundle. The only thing that stays in the bundle is Shopstory renderer. The renderer itself is extremely lean and takes as little KBs as possible. Every more complex logic is lazy loaded so it won't affect your Web Vitals. For example if we provide slider with custom swipe logic, this logic doesn't load during the first paint. It will be lazy loaded after all the most important stuff loaded so it won't affect Web Vitals.
The content blocks that editor picked for a specific page are not kept in your bundle. They're loaded dynamically so that you load only the ones that are used and nothing more. For example in next.js it means that all the info about specific content blocks is passed via getInitialProps or getStaticProps.
As for rendering performance, it's close to pure HTML + static CSS, the overhead is close to zero.
Actually, we believe that in most cases using Shopstory content blocks will make Web Vitals better. The reason for this is that we can build very complex optimisations that are hard to build for ecommerce business because of time and budget constraints.