Piwigo / piwigo-bootstrap-darkroom

A mobile-ready and feature-rich theme for Piwigo photo gallery, based on Bootstrap 4
Apache License 2.0
81 stars 40 forks source link

Slick carousel hangs page loading Firefox #173

Open stavoltafunzia opened 5 years ago

stavoltafunzia commented 5 years ago

I have several albums in my piwigo gallery, and the biggest one containes approximately 1100 photos. Only with this album, I noticed that the slick carousel makes the picture detail page not to load, with cpu usage fixed at 100% until I get a warning of an unresponsive javascript. After blocking such script, the page is loaded correctly except for the slick carousel that is missing.

I experienced this with Firefox, both desktop and Android, while in Chrome the slick carousel works fine.

tkuther commented 5 years ago

Duplicate of #155

I cannot reproduce it with Firefox on Linux or MacOS, though (~2k images album)

stavoltafunzia commented 5 years ago

I tried on a second machine, still have the problem. Steps to reproduce:

1) Start with clean latest piwigo installation 2) Install bootstrap-darkroom theme, make it the default, disable all other themes; 3) create folder (album) /galleries/asd ; 4) put a jpg image in the folder created at point 3, and name it "a"; 5) copy in the same folder the script that you can download here, and execute it. It simply copies the file "a" several times, giving to the photos the same names as I have in my PCs; 6) make full synchronization from piwigo administration (so album "asd" is detected); 7) navigate with Firefox to the album "asd" and open a photo.

If it may be relevant, the host is running on Debian9 with nginx, MariaDB and php7.2. I tried also on a clean Debian9 installation. Moreover, for point 4, I'm using a jpg image of at least 2MB.

Let me know if you can reproduce it.

tkuther commented 5 years ago

I managed to reproduce it with a 7k+ album.

Though, the issue is somewhere in slick. I can only recommend to disable slick if you have such large albums.

stavoltafunzia commented 5 years ago

If it is an issue due only to slick carousel maybe it should be reported on their github page.

plegall commented 5 years ago

I have the same problem, but not especially in a big album. I perform a search, with several hundreds of results and bam the picture.php page is hanging (with Firefox 63)

plegall commented 5 years ago

Maybe it's not Slick that should fix this problem. Maybe Piwigo should not give more than ~20 photos for the carrousel.

tkuther commented 5 years ago

Yeah, items could be added dynamically to slick, ideally using ws api (currently it's a php side db query that adds a theme var which gets smartied into DOM, and that one gets parsed by slick js - seems Firefox is loosing it's mind somewhere in between, works fine in Chrome, Safari and others, though)

Schmidtze2 commented 5 years ago

I have nearly the same, or maybe exactly the same problem: I just tested it with Chrome, IE11 and Firefox. Firefox hangs up, and in Chrome and IE I can see in developer window under network, that the property "ondemand" doesn't have any impact. All images will be loaded in background. The IE says that a script maybe is blocking, Chrome doesn't grumble, but it becomes very slow. My Android phone with Chrome also hangs up, depending on the amount of images.

A very important note maybe: This problem only occurs, as I see by now, when opening an image in tag mode, by using an url like /picture.php?/24442/tags/2537-ort_stadt_berlin

Best regards Friedemann

tkuther commented 5 years ago

This seems fixed in Firefox Quantum 64.0 - tested MacOS and Linux.

prolibre commented 5 years ago

Hello,

Same problem with Windows 10

The only way to fix the problem is to disable "Slick Carousel".

No problem in small albums (about a hundred photos) but problem with albums of 1000 photos and more.

Configuration :

Piwigo 2.9.4 Bootstrap Darkroom 2.3.5 Linux PHP: 7.2 MySQL: 5.5.5-10.1.37-MariaDB-0+deb9u1 ImageMagick 6.9.7-4

ritzsite commented 5 years ago

I've encountered the same problem in Windows 10. In my case it happens on all "canonical" picture pages, the ones that are indexed by search engines. It doesn't happen when accessing picture pages by way of albums or tags etc. But that may be because I don't have any albums with 1000 pictures or more. Chrome opens these canonical pages without a problem. Disabling "slick carousel" solves the issue in Firefox.

Configuration: Firefox Quantum 65.0.2 (64-bit) Piwigo 2.9.4 Bootstrap Darkroom 2.4.1 Operating system: Linux PHP: 7.1.26 MySQL: 5.7.25-0ubuntu0.16.04.2 Graphics Library: ImageMagick 6.8.9-9

Edit: Slick carousel settings: lazyLoad method: ondemand (the same happens with progressive method) Infinite looping: off Center mode: off

I hope this info helps in solving the issue.

Undergrid commented 5 years ago

I'm having the same issue. Works fine on Chrome (Version 72.0.3626.121 - 64-bit) but stalls on Firefox (65.0.2 - 64-bit) and Edge (42.17134.1.0). It seems to start once you get to a few hundred photos and gets worse the more photos you have.

It doesn't seem to be downloading all the photos, but profiling on Firefox shows it's doing a lot of reflowing and layout calculation, then some sort of timeout kicks in and things starts working again.

Edit to add Piwigo: 2.9.4 Theme: 2.4.1