I am developing a website similar to this site in PHP and jQuery. As you can see they don’t load all their images at once, and they don’t create for each image and fill it when you scroll to that image. What they do is they load few pages ahead and they keep few of previous pages, unless you jump to a page far in the middle. Any idea how they do this ? and what structure they are using ? I looked at the HTML source and did not understand anything ! And the most important part is they change the URL as you go to the next page, so if you copy the URL of that page and open it in another browser window, it goes to the exact same page.
Share
It’s a very broad question. I’m not sure it’s worth the exercise giving a “high level” overview of how they accomplish it; digging into the page a little bit and certain things are more obvious (remembering the position is just done with an integer in the URL; on page load this integer is parsed out so that the application can know which images to load with AJAX) and some are less obvious (didn’t really look into how it deals with images of different sizes).
It’s a well-made and complex piece of code. Emulating it won’t be easy. 😉