Support Forums

How to deal with CMS previews?


I have a static site built by Eleventy on Netlify and I’m trying to figure out how to allow headless CMS users to preview pages that haven’t necessarily been built yet. Preview generally tends to be instant, as soon as a user finishes typing something in their CMS admin editor and they press the “View” or “Preview” button, they expect to be taken to a page that reflects their changes. Rebuilding and deploying a static site/page on the other hand can vary between dozen(s) of seconds and minutes, far from instant, which is made worse by the fact that SSGs generally can’t do partial rebuilds, they rebuild the entire site (at least Eleventy does?).

So I’m a bit stuck. Has anyone had to implement this? I’m currently looking at 2 CMSes (WordPress and prismic.io), but I imagine the same applies to others.

Any thoughts?

Edit: After typing the above I realised this problem exists also in general, when a user makes a change and saves a page in the CMS, this will trigger a rebuild which isn’t instant, so when they refresh their site it will take a while for it to show the updates. This isn’t the case in a “dynamic” site (like a php site / Wordpress theme), is this generally not considered a problem, or are rebuilds faster on the paid tiers so it’s not as big of a problem?

P.S. I wasn’t sure where to put this question, please move it if this is the wrong forum.

I don’t think you’re in the wrong place! It is true that we don’t have any real productized “instant-view” situations - except in the CMS editor, where we do show you the wysiwig view. I take it that isn’t helpful for your use case? That’s instant/real-time and if it isn’t showing you the correct content, that sounds like a bug!

Let me know a but more about your use case and I’ll see if we can find you some better advice.

There are two ways to preview your web page while you are editing. You may preview within the context of the CMS and see how your edits would take effect, or you may view the page as it has been published. This may be useful if you need to make comparisons between the existing page and your edits krogerfeed

Within the CMS (Staging)
As Published

The “work flow” of netlify CMS is like this:
You go to yourwebsite.com/admin and make changes, you Save/Publish and Netlify CMS then saves that change to your Github repo and then has to run the deply script npm run generate or whatever you chose the command to be.
It will ALWAYS take a few minutes :frowning: but you get free CDN hosting and tons of other great features :slight_smile: