If I deploy my site and users are currently on it, there seems to always be crashes and bug logs that pop up until they refresh their browsers. When deploying, do current users automatically start getting the new site and therefore have mixed js bundles? Is there a way to prevent this or transition users to the new deploy?
No, that doesn’t happen unless your code is constantly requesting the files in the background. Read here: From Unstable to Reliable: A Release Engineering Journey | Netlify
I am using React and specifically I used
create-react-app. Do you know if something in the default setup with Create React App might be causing this? The only thing I can tell from logs so far, is that consistently users encounter crashes if they are on the site while a deploy happens.
Just to clear it out, which logs and what exactly are we calling crashes?
No static website would “crash” in normal cases if it doesn’t keep doing something in the background.
I am using BugSnag to log errors, and generally a “crash” is some unhandled JS error that causes the site to stop working or go to a blank screen. For example: in my app I am use Twilio and users can be on Video Calls. If they are on one during a deploy, they all get disconnected from the video call and have to refresh the page or reconnect to the video call.
Well this is a first then. I personally have never seen such a case or have faced this issue myself. I am in the belief that Netlify deploys all or nothing at once. So, there have never been such cases.
However, would it be possible for you to share the logs or the JS errors that you get which might point as to what exactly is happening?
Well unfortunately if someone has an error from a bundle in previous deploy the source map data is not there but here is what I’ve got:
TypeError Cannot read property 'style' of null /static/js/main.95bcdaa0.chunk.js:1:732324
This error seems to imply that a style attribute which I believe is reading from a css module got lost. I’ll dig some more into it to see if this error is just coincidentally coming after a deploy.
Thanks for your quick responses!
This error means that it’s unable to set the style of an element because:
1.The element doesn’t exist in the DOM at all.
2. The element was selected before it existed in the DOM.
3. The selector was later overridden with the value as
So, if you have something like:
document.querySelector('.some-class').style.marginLeft = 0;, it would return such a kind of error when any one of the above conditions matches.
But yeah, this reply doesn’t solve your problem. However, I don’t see why this would happen only when a deploy is pushed. Are you sure it doesn’t happen any other time?
Maybe some support engineer or someone else can throw more light on this subject, but it’s indeed a strange behaviour.
Agreed that this seems to be a DOM error and probably not related to the deploy. I’ll dig deeper into it, thank you!