InfiniWall is a script for desktop and mobile that lets you pan/scroll a potentially infinite number of elements on screen. It is obsessively optimized for mobile devices that notoriously have troubles handling a large number of tags at the same time (especially images).

Before you get too excited please consider that the script is still in “proof of concept” stage. Many small glitches need to be solved, customization options should be added and I believe that we can make it even smoother.

If you think I should invest more time on this script you may consider supporting its development.

How it works

The idea is simple. I’m using 25 elements only at any given time. By moving and rearranging them you get the illusion of a seamless indefinitely pannable surface.

Here’s a video

Mobile development makes us better desktop developers. Due to the shortage of memory and resources mobile devices force us to uber optimize our scripts and an optimized script runs better on desktop too. That reminds me of those guys who ported Doom to the Commodore 64. Optimization can bring you really far.

The script gets interesting once you add lazy loading to the mix. In the demo you’ll find in the github repository I’m dynamically loading 25 images out of 100 as soon as they become visible on the screen. Images are then released when they move out of sight. More work is needed to make it rock solid, but I believe it’s time to show it to the world and receive some feedback.

So here it is InfiniWall, you can grab it on github and if it receives some love I’ll keep developing it.

12 thoughts on “InfiniWall”

  1. Due to a missing tag in the code the comment form was redirecting to the donation page. Sorry about that, it wasn’t my intention 🙂 now it is fixed.

  2. This is very nice! It’s simplistic and flipboardy…It would be cool if you click on the image, and it will flip over kinda like the iPad music app and album covers. Also, it would be cool if you had the option to take up the whole screen. Very very nice! Thank you Matteo!

    1. As soon as I get some spare time I’ll make a more interesting demo with some real data and ajax loaded contents. Dunno a flickr browser maybe (with picture zoom in of course).

  3. Do you think that works for an online Shop? If so – i will hire you 😉

  4. Yeah, nice job!

    Please keep contributing to our community 🙂

  5. The sample shows a 3×3 grid. Would it be easy to make it a 1×5 grid?

    It seems that configuring the grid has to be done in infiniwall.js. Any suggestions?

  6. Nice script dude, but it’s missing something very important. It’s not designed to be responsive. Will you help me make a responsive version?

    I can contribute with CSS and device/browser testing, I have already started. Tell me where I can find you, I would like to discuss this further with you.


Comments are closed.