Edge Cases & Stress Tests

Interactive demo to test the masonry layout with various edge cases and automated stress tests. Use the controls to adjust parameters and observe layout behavior.

Item Settings

Number of items: 20 Min height: 50px Max height: 300px Fixed height (use min only)

Column Settings

minColWidth: 200px maxColWidth: 400px gap: 15px

Animation Settings

Animate transitions Duration: 200ms

Container Settings

Container width: 100% Constrained max-width (800px)

Virtualization

Enable virtual scrolling Scroll height: 500px Overscan: 5

Quick Presets

🔥 Automated Stress Tests

Width: 0px Height: 0px Columns: calculating... Items: 20

#0 292px

#9 134px

#18 225px

#1 286px

#10 79px

#19 73px

#2 296px

#11 109px

#3 210px

#12 90px

#4 200px

#13 233px

#5 104px

#14 66px

#6 236px

#15 228px

#7 295px

#16 242px

#8 62px

#17 155px