Lazy Load

What it does

When a large display of e.g. many thumbnails or many images in a filmstrip are potentially visible, only the ones that are actually inside the viewport c.q. browser window will be loaded from the server. As soon as other images become inside the viewport e.g. by scrolling, the images will be loaded from the server. This speeds up building up the initial display of the page.

How to activate

Select one of the options not being off in Advanced settings -> System -> I -> Item 23: Lazy load

How it is implemented

The way this is achieved is as smart as simple: On building up the page content, wppa <img> tags do not contain the src="..." attribute, but the data-src="..." attribute containing the images url.
On the events DOMContentLoaded, resize, scroll, orientationchange and a few others, the function wppaMakeLazyVisible() is called that replaces the attribute data-src by src with the same url for those images that became (partially) 'in sight'.
This immediately causes the images to be loaded. The data-src attribute is removed, so the check and creation of the src attribute happens only once for each lazy load image.

Example

[wppa type="thumbs" album="205" size="300" align="center"]

Docs by subject•Advanced topics•Optimization•Lazy Load•Fractals

Fractals made by OpaJaaps program Fractals 1.0

Owens C 04-01_alt.jpg (wppa-admin)

Notes: 4.50

200 vus

Owens C 05-01.jpg (wppa-admin)

Notes: 3.00

148 vus

Owens C 05-01_alt.jpg (wppa-admin)

Notes: 1.67

140 vus

Owens C 05-02.jpg (wppa-admin)

Notes: 5.00

171 vus

Owens C 05-08.jpg (wppa-admin)

120 vus

Owens C 05-08_alt.jpg (wppa-admin)

Notes: 3.00

95 vus

Owens C 05-13.jpg (wppa-admin)

74 vus

Owens C 05-19.jpg (wppa-admin)

78 vus

Owens C 05-19_alt.jpg (wppa-admin)

65 vus

Owens C 05-20.jpg (wppa-admin)

79 vus

Owens C 05-20_alt.jpg (wppa-admin)

66 vus

Owens L 02-01.jpg (wppa-admin)

43 vus

Owens L 02-01_alt.jpg (wppa-admin)

53 vus

Owens L 02-02.jpg (wppa-admin)

58 vus

Owens L 02-03.jpg (wppa-admin)

43 vus

Owens L 02-04.jpg (wppa-admin)

43 vus

Owens L 02-05.jpg (wppa-admin)

37 vus

Owens L 02-06.jpg (wppa-admin)

1 commentaire

158 vus

Owens L 02-07.jpg (wppa-admin)

39 vus

Owens L 02-08.jpg (wppa-admin)

35 vus

Owens L 02-08_alt.jpg (wppa-admin)

46 vus

Owens L 03-01.jpg (wppa-admin)

40 vus

Owens L 03-01_alt.jpg (wppa-admin)

22 vus

Owens L 03-08.jpg (wppa-admin)

41 vus

Owens L 03-08_alt.jpg (wppa-admin)

Notes: 5.00

34 vus

Owens O 02-01.jpg (wppa-admin)

39 vus

Owens O 02-01_alt.jpg (wppa-admin)

26 vus

Owens O 02-02.jpg (wppa-admin)

27 vus

Owens O 02-08.jpg (wppa-admin)

22 vus

Owens O 02-08_alt.jpg (wppa-admin)

27 vus

Owens O 02-19.jpg (wppa-admin)

28 vus

Owens O 02-19_alt.jpg (wppa-admin)

26 vus

Owens O 02-20.jpg (wppa-admin)

11 vus

Owens O 02-20_alt.jpg (wppa-admin)

18 vus

Owens P 02-03.jpg (wppa-admin)

15 vus

Owens P 02-08.jpg (wppa-admin)

15 vus

Owens P 02-08_alt.jpg (wppa-admin)

19 vus

Owens P 03-01.jpg (wppa-admin)

16 vus

Owens P 03-01_alt.jpg (wppa-admin)

23 vus

Owens P 04-01.jpg (wppa-admin)

20 vus

Owens P 04-01_alt.jpg (wppa-admin)

11 vus

Owens P 04-08.jpg (wppa-admin)

30 vus

Owens P 04-08_alt.jpg (wppa-admin)

9 vus

Quad.jpg (wppa-admin)

14 vus

Quart - 2.jpg (wppa-admin)

21 vus

Quart - 3.jpg (wppa-admin)

16 vus

Quart - 4.jpg (wppa-admin)

22 vus

Quart - 5.jpg (wppa-admin)

27 vus

Smith - 1.jpg (wppa-admin)

34 vus

Smith - 2.jpg (wppa-admin)

15 vus

Smith - 3.jpg (wppa-admin)

41 vus

Smith - 4.jpg (wppa-admin)

39 vus

Spin.jpg (wppa-admin)

27 vus

Sterling - 10.jpg (wppa-admin)

Notes: 1.00

13 vus

Sterling - 10_alt.jpg (wppa-admin)

Notes: 2.00

41 vus

Sterling - 11.jpg (wppa-admin)

Notes: 1.00

28 vus

Sterling - 11_alt.jpg (wppa-admin)

Notes: 2.00

14 vus

Sterling - 18.jpg (wppa-admin)

18 vus

Sterling - 18_alt.jpg (wppa-admin)

17 vus

Sterling - 19.jpg (wppa-admin)

20 vus

Sterling - 19_alt.jpg (wppa-admin)

17 vus

Sterling - 2.jpg (wppa-admin)

16 vus

Sterling - 20.jpg (wppa-admin)

16 vus

Sterling - 3.jpg (wppa-admin)

23 vus

Sterling - 4.jpg (wppa-admin)

23 vus

Sterling - 4_alt.jpg (wppa-admin)

25 vus

Sterling - 5.jpg (wppa-admin)

10 vus

Sterling - 52.jpg (wppa-admin)

17 vus

Sterling - 52_alt.jpg (wppa-admin)

42 vus

Sterling - 53.jpg (wppa-admin)

21 vus

Sterling - 53_alt.jpg (wppa-admin)

10 vus

Sterling - 54.jpg (wppa-admin)

19 vus

Sterling - 54_alt.jpg (wppa-admin)

14 vus

Sterling - 55.jpg (wppa-admin)

9 vus

Sterling - 55_alt.jpg (wppa-admin)

20 vus

Sterling - 5_alt.jpg (wppa-admin)

17 vus

Sterling - 6.jpg (wppa-admin)

11 vus

Sterling - 7.jpg (wppa-admin)

13 vus

Sterling - 7_alt.jpg (wppa-admin)

24 vus

Sterling - 8.jpg (wppa-admin)

12 vus

Sterling - 8_alt.jpg (wppa-admin)

8 vus

Sterling - 9.jpg (wppa-admin)

25 vus

Sterling - 9_alt.jpg (wppa-admin)

17 vus

Swanson.jpg (wppa-admin)

14 vus

Tchebychev - C2.jpg (wppa-admin)

20 vus

Tchebychev - C3.jpg (wppa-admin)

25 vus

Tchebychev - C4.jpg (wppa-admin)

22 vus

Tchebychev - C6.jpg (wppa-admin)

32 vus

Tchebychev - C7.jpg (wppa-admin)

28 vus

Tchebychev - S2.jpg (wppa-admin)

14 vus

Tchebychev - S3.jpg (wppa-admin)

27 vus

Tchebychev - S4.jpg (wppa-admin)

18 vus

Tchebychev - S5.jpg (wppa-admin)

10 vus

Tchebychev - S6.jpg (wppa-admin)

26 vus

Tchebychev - S7.jpg (wppa-admin)

35 vus

Tchebychev - T2.jpg (wppa-admin)

22 vus

Tchebychev - T3.jpg (wppa-admin)

13 vus

Tchebychev - T4.jpg (wppa-admin)

29 vus

Tchebychev - T5.jpg (wppa-admin)

28 vus

Tchebychev - T6.jpg (wppa-admin)

16 vus