Slow load time due to many images. about facebook-album-browser

[dejanstojanovic]

Hi,

I think there is already some lazy loading for images, but it looks like it does not work so perfect for you :(
The issue might be also loading of JSON as it loads page by page, which means it makes more than one request to load all for creating the structure.
Is is possible somehow that you share the URL of your sample page with the actual album that you are loading so I can try to figure out what might be the issue.

[sDamme]

Hi,
Yeah, it's certainly possible. The site name is www.tartoo-tattoo.ee
I'm sure you will find many things that make your jaw drop, due to bad coding or such. X_x

[dejanstojanovic]

First thing, try not to load all albums at once. For example, when you click show works then you initialize the album in the container in case there is no photo elements in it, otherwise just show the container as it was loaded previously.
I hope this will help.
There is really no need to load everything when the page loads.

[sDamme]

Ah okay,
Sorry for bothering a bit more but what should I look for / do to achieve that?

Edit: Ah figured it out. Thanks for the help, even tho it was something I should've noticed myself right away

[dejanstojanovic]

Ok,
This is the part I was reffering to
$(document).ready(function () {
$(".fb-album-container").each(function () {
.....
)}
)}

This will take so much time while initially loading the page.
Instead, attach handle to buttons with nav-toggle class. I suggest you add one more dummy class which you will use for the selector. Same class should be on the container which will be used for the album.
The rest is as I mentioned in previous message: when expanded load the album if not loaded previously

I hope I helped

[sDamme]

Oh you helped much. :)
I actually facepalmed myself a bit later for asking this, it's basic jquery.... I've been working with angular too much lately. :D
I think it should be something like this to fire it just once when the toggle gets clicked:

$('#nav-toggle').one('click', function(){

I will experiment with it to find the best solution to that. :)
Thanks again.