Pre-Loader Bug?

The websites load very fast for me as well, but I do believe that pre-loader is not working sometimes, because I have the similar issue with some of my websites as well.

1 Like

Same here.
Sometimes when you make changes on your project and you upload it to your server the pre-loader doesn’t work anymore.
You must then implement it again, export your project and upload it.
This is almost daily routine.

When you upload, make sure you re-upload the new HTML and the new JS as these files change per export depending on whether a pre-loader is used or not.

2 Likes

Ok, thanks!

I’m having the same issue. Despite a complete upload of the site (after deleting the old one), the pre-loader simply doesn’t show up. The page uses a Hero bloc with an animated title. When the page first loads, the animation messes with the page layout - forcing all the text to the top of the page before finally settling down once the page fully loads. Normally, the pre-loader would mask this effect, but for some reason it’s stopped doing it.

Is everyone viewing in Safari? In Chrome, Firefox, etc., you see the preloader for a second, at least I do on a 150mbps+ connection.

dogado .de - is the host for all 3 of those sites.

I always do that

The pre-loader is NOT showing on Safari. All other browsers (Firefox, Cliqz, Chrome, Vivaldi) are OK.
Running 10.13.4 BETA 5

That was my point. :wink:

Ah! it seems to be a browser problem - works fine in Chrome but not in Safari.

yeah I get that at the office but not at home.

Actually I remember now, I had to remove the pre-loader from Safari as it had a habit of getting stuck if there were video backgrounds or videos on page.

Basically Safari doesn’t class the page as fully loaded until all videos are completely parsed and it was really slowing the page load speeds down. The other browsers don’t force this and the spinner usually goes after seconds of the video being initially parsed and doesn’t require the completion of the parsing in order to trigger the page is loaded event.

Im almost certain its in the release notes in the last few releases.

I might have missed it.
Are you going to fix it?

Ok. Please could you fix it. Because the problem is the animation in safari. that doesn’t work fine without a pre-loader.

1 Like

It’s not possibly from what I can see, Safari doesn’t call the page loaded event until after the full video is loaded into the memory, I’ve no idea why that happens. I can re-enable but if your visitors are on Safari and you load a video from youtube or your own hosting, you page wont show until that video is fully loaded, people will just leave your site.

So unless someone can enlighten me with a good robust workaround, pre-loaders currently cant work on Safari as they cause unwanted pauses in page loads.

@Norm can i post a video to show the animation problem without a pre-loader? it doesn’t look good. in this case i have to delete an animation.

Yeah I understand, but its something I tried to fix and simply couldn’t. You can manually remove the snippet that Blocks it in Safari if you want, but it if any of your pages include video bg’s or load videos it will slow it down considerably depending on how big the video BG is.

To manually bring back the spinner in Safari.

Export your project and select to not minify the blocs.js.

Open the Blocs.js file and remove line 18.

Here are some live examples.

Now take into consideration that this is a very basic page just loading a video bg. It doesn’t take long but you should see the delay in Safari, this only amplifies if you have more content and videos on the page.

Open Link 1 in Chrome and Safari, they will load at a similar speed, because Safari doesn’t use a pre-loader.

Link1

Open Link 2 in Chrome and Safari, you should see the delay in Safari as it has a pre-loader enabled.

Link2

The most irritating part is, as soon as Safari has loaded the page, it loads really quickly with a refresh, so this only effects new visitors who visit for the first time in Safari. I spent around 6 hours trying to figure out a hack to get around it, but didn’t make any progress. Maybe someone else here in the forum has a idea??

Async CSS Loading
Hi Norm, is it possible to load the mp4 files async with css? it should be solve the problem ?

I’m not sure, I’ll take a look. Lazy load already partially fixed the issue unless a video is used above the fold.

Glad I found this, and thanks Norm.

I can report this safari solution works fairly well for me…I say ‘fairly’ well because my site appears to load so fast that the ‘gear’ pre-loader doesn’t have a chance to load first, but appears to interrupt the banner as it is loading, as the ‘gears’ pop up, and then the banner returns with its text animation working as expected, with a single loop.

it’s better than the double animation. :upside_down_face: