bradbirdsall/Swipe — Issue #31: item.faraway { visibility: hidden; }
Author: rocktronica
Created: 2012-01-31 00:55:43+00:00
State: open

Writing a fullscreen swiping magazine. Kept crashing iPad1s after 5 pages or so of content... even with all the JS optimizations, queued DOM builds, etc I could think of.

Turns out you can *DRASTICALLY* decrease resource usage on older devices by toggling visibility CSS.

Mine looked like this:

.page { visibility: hidden; }
.page[role] { visiblity: visible; }

Where role was assigned to the previous, current, and next items on each swipe callback. Arbitrary, could be any valid selector.

Caveats:

- Multiple, fast swipes can bring in invisible pages.
- Some flickering on iPad1 (But a real step up from outright crashing!)

Please let me know if you need any more info. I spent a *ton* of time trying to figure this out!