ಲೇಜಿ ಲೋಡಿಂಗ್: ಚಿತ್ರಗಳು ಮತ್ತು ಕಾಂಪೊನೆಂಟ್‌ಗಳೊಂದಿಗೆ ವೆಬ್ ಕಾರ್ಯಕ್ಷಮತೆಯನ್ನು ಉತ್ತಮಗೊಳಿಸುವುದು

ಇಂದಿನ ಡಿಜಿಟಲ್ ಜಗತ್ತಿನಲ್ಲಿ, ವೆಬ್‌ಸೈಟ್ ಕಾರ್ಯಕ್ಷಮತೆಯು ಅತ್ಯಂತ ಮಹತ್ವದ್ದಾಗಿದೆ. ಬಳಕೆದಾರರು ವೇಗದ, ಸ್ಪಂದನಾಶೀಲ ಅನುಭವಗಳನ್ನು ನಿರೀಕ್ಷಿಸುತ್ತಾರೆ, ಮತ್ತು ಸರ್ಚ್ ಇಂಜಿನ್‌ಗಳು ಅದನ್ನು ತಲುಪಿಸುವ ವೆಬ್‌ಸೈಟ್‌ಗಳಿಗೆ ಆದ್ಯತೆ ನೀಡುತ್ತವೆ. ಕಾರ್ಯಕ್ಷಮತೆಯನ್ನು ಹೆಚ್ಚಿಸುವ ಒಂದು ನಿರ್ಣಾಯಕ ತಂತ್ರವೆಂದರೆ ಲೇಜಿ ಲೋಡಿಂಗ್. ಈ ಲೇಖನವು ಲೇಜಿ ಲೋಡಿಂಗ್ ಚಿತ್ರಗಳು ಮತ್ತು ಕಾಂಪೊನೆಂಟ್‌ಗಳಿಗೆ ಒಂದು ಸಮಗ್ರ ಮಾರ್ಗದರ್ಶಿಯನ್ನು ಒದಗಿಸುತ್ತದೆ, ಇದು ನಿಮ್ಮ ವೆಬ್‌ಸೈಟ್ ಅನ್ನು ಜಾಗತಿಕ ಪ್ರೇಕ್ಷಕರಿಗಾಗಿ ಉತ್ತಮಗೊಳಿಸಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ.

ಲೇಜಿ ಲೋಡಿಂಗ್ ಎಂದರೇನು?

ಲೇಜಿ ಲೋಡಿಂಗ್ ಎನ್ನುವುದು ಸಂಪನ್ಮೂಲಗಳ (ಚಿತ್ರಗಳು, ಐಫ್ರೇಮ್‌ಗಳು, ಕಾಂಪೊನೆಂಟ್‌ಗಳು, ಇತ್ಯಾದಿ) ಲೋಡಿಂಗ್ ಅನ್ನು ಅವು ನಿಜವಾಗಿ ಅಗತ್ಯವಿರುವವರೆಗೆ ಮುಂದೂಡುವ ಒಂದು ತಂತ್ರವಾಗಿದೆ – ಸಾಮಾನ್ಯವಾಗಿ, ಅವು ವ್ಯೂಪೋರ್ಟ್ (viewport) ಪ್ರವೇಶಿಸಲು ಸಿದ್ಧವಾದಾಗ. ಇದರರ್ಥ, ಎಲ್ಲಾ ಆಸ್ತಿಗಳನ್ನು ಆರಂಭದಲ್ಲೇ ಲೋಡ್ ಮಾಡುವ ಬದಲು, ಬ್ರೌಸರ್ ಆರಂಭಿಕ ಪುಟ ಲೋಡ್‌ನಲ್ಲಿ ಬಳಕೆದಾರರಿಗೆ ಗೋಚರಿಸುವ ಸಂಪನ್ಮೂಲಗಳನ್ನು ಮಾತ್ರ ಲೋಡ್ ಮಾಡುತ್ತದೆ. ಬಳಕೆದಾರರು ಪುಟವನ್ನು ಕೆಳಗೆ ಸ್ಕ್ರಾಲ್ ಮಾಡಿದಂತೆ, ಹೆಚ್ಚು ಸಂಪನ್ಮೂಲಗಳು ಗೋಚರವಾಗುತ್ತಿದ್ದಂತೆ ಲೋಡ್ ಆಗುತ್ತವೆ.

ಇದನ್ನು ಹೀಗೆ ಯೋಚಿಸಿ: ನೀವು ಒಂದು ಪ್ರವಾಸಕ್ಕೆ ಪ್ಯಾಕ್ ಮಾಡುತ್ತಿದ್ದೀರಿ ಎಂದು ಕಲ್ಪಿಸಿಕೊಳ್ಳಿ. ನಿಮ್ಮ ಸಂಪೂರ್ಣ ವಾರ್ಡ್ರೋಬ್ ಅನ್ನು ಮೊದಲಿನಿಂದಲೂ ಎಳೆದುಕೊಂಡು ಹೋಗುವ ಬದಲು, ನಿಮಗೆ ತಕ್ಷಣವೇ ಬೇಕಾಗುವ ಬಟ್ಟೆಗಳನ್ನು ಮಾತ್ರ ನೀವು ಪ್ಯಾಕ್ ಮಾಡುತ್ತೀರಿ. ನಿಮ್ಮ ಪ್ರಯಾಣದಲ್ಲಿ ನೀವು ಮುಂದುವರಿದಂತೆ, ನಿಮಗೆ ಅಗತ್ಯವಿರುವ ಹೆಚ್ಚುವರಿ ವಸ್ತುಗಳನ್ನು ನೀವು ಅನ್ಪ್ಯಾಕ್ ಮಾಡುತ್ತೀರಿ. ವೆಬ್‌ಸೈಟ್‌ಗಳಿಗೆ ಲೇಜಿ ಲೋಡಿಂಗ್ ಮೂಲಭೂತವಾಗಿ ಹೀಗೆಯೇ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ.

ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನ್ನು ಏಕೆ ಬಳಸಬೇಕು?

ಲೇಜಿ ಲೋಡಿಂಗ್ ಹಲವಾರು ಗಮನಾರ್ಹ ಪ್ರಯೋಜನಗಳನ್ನು ನೀಡುತ್ತದೆ:

• ಸುಧಾರಿತ ಆರಂಭಿಕ ಪುಟ ಲೋಡ್ ಸಮಯ: ಪರದೆಯಾಚೆಯ ಸಂಪನ್ಮೂಲಗಳ ಲೋಡಿಂಗ್ ಅನ್ನು ಮುಂದೂಡುವುದರಿಂದ, ಬ್ರೌಸರ್ ತಕ್ಷಣವೇ ಬಳಕೆದಾರರಿಗೆ ಗೋಚರಿಸುವ ವಿಷಯವನ್ನು ಲೋಡ್ ಮಾಡುವುದರ ಮೇಲೆ ಗಮನಹರಿಸಬಹುದು. ಇದು ವೇಗವಾದ ಆರಂಭಿಕ ಪುಟ ಲೋಡ್ ಸಮಯಕ್ಕೆ ಕಾರಣವಾಗುತ್ತದೆ, ಬಳಕೆದಾರರ ಮೊದಲ ಅನಿಸಿಕೆಯನ್ನು ಸುಧಾರಿಸುತ್ತದೆ ಮತ್ತು ಬೌನ್ಸ್ ದರಗಳನ್ನು ಕಡಿಮೆ ಮಾಡುತ್ತದೆ.
• ಕಡಿಮೆ ಬ್ಯಾಂಡ್‌ವಿಡ್ತ್ ಬಳಕೆ: ಬಳಕೆದಾರರು ತಾವು ನಿಜವಾಗಿ ನೋಡುವ ಸಂಪನ್ಮೂಲಗಳನ್ನು ಮಾತ್ರ ಡೌನ್‌ಲೋಡ್ ಮಾಡುತ್ತಾರೆ, ಇದು ಬ್ಯಾಂಡ್‌ವಿಡ್ತ್ ಬಳಕೆಯನ್ನು ಕಡಿಮೆ ಮಾಡುತ್ತದೆ, ವಿಶೇಷವಾಗಿ ಮೊಬೈಲ್ ಸಾಧನಗಳಲ್ಲಿ ಅಥವಾ ಸೀಮಿತ ಡೇಟಾ ಯೋಜನೆಗಳನ್ನು ಹೊಂದಿರುವ ಬಳಕೆದಾರರಿಗೆ. ನಿಧಾನಗತಿಯ ಇಂಟರ್ನೆಟ್ ವೇಗ ಅಥವಾ ದುಬಾರಿ ಡೇಟಾ ಇರುವ ಪ್ರದೇಶಗಳ ಬಳಕೆದಾರರಿಗೆ ಇದು ವಿಶೇಷವಾಗಿ ಮುಖ್ಯವಾಗಿದೆ.
• ಕಡಿಮೆ ಸರ್ವರ್ ಲೋಡ್: ಕಡಿಮೆ ಆರಂಭಿಕ ವಿನಂತಿಗಳನ್ನು ಪೂರೈಸುವ ಮೂಲಕ, ಸರ್ವರ್ ಕಡಿಮೆ ಲೋಡ್ ಅನ್ನು ಅನುಭವಿಸುತ್ತದೆ, ಇದು ಒಟ್ಟಾರೆ ವೆಬ್‌ಸೈಟ್ ಕಾರ್ಯಕ್ಷಮತೆ ಮತ್ತು ಸ್ಕೇಲೆಬಿಲಿಟಿಯನ್ನು ಸುಧಾರಿಸಬಹುದು.
• ಉತ್ತಮ ಬಳಕೆದಾರ ಅನುಭವ: ವೇಗದ ವೆಬ್‌ಸೈಟ್ ಉತ್ತಮ ಬಳಕೆದಾರ ಅನುಭವವನ್ನು ಒದಗಿಸುತ್ತದೆ, ಇದು ಹೆಚ್ಚಿದ ನಿಶ್ಚಿತಾರ್ಥ, ಪರಿವರ್ತನೆಗಳು ಮತ್ತು ಗ್ರಾಹಕರ ತೃಪ್ತಿಗೆ ಕಾರಣವಾಗುತ್ತದೆ.
• ಸುಧಾರಿತ ಎಸ್‌ಇಒ (SEO): ಗೂಗಲ್‌ನಂತಹ ಸರ್ಚ್ ಇಂಜಿನ್‌ಗಳು ಪುಟ ಲೋಡ್ ವೇಗವನ್ನು ರ್ಯಾಂಕಿಂಗ್ ಅಂಶವಾಗಿ ಪರಿಗಣಿಸುತ್ತವೆ. ಲೇಜಿ ಲೋಡಿಂಗ್ ನಿಮ್ಮ ವೆಬ್‌ಸೈಟ್‌ನ ಎಸ್‌ಇಒ ಕಾರ್ಯಕ್ಷಮತೆಯನ್ನು ಸುಧಾರಿಸಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ.

ಲೇಜಿ ಲೋಡಿಂಗ್ ಚಿತ್ರಗಳು

ಚಿತ್ರಗಳು ಸಾಮಾನ್ಯವಾಗಿ ವೆಬ್‌ಸೈಟ್‌ನಲ್ಲಿನ ಅತಿದೊಡ್ಡ ಆಸ್ತಿಗಳಾಗಿವೆ, ಇದು ಅವುಗಳನ್ನು ಲೇಜಿ ಲೋಡಿಂಗ್‌ಗೆ ಪ್ರಮುಖ ಅಭ್ಯರ್ಥಿಗಳನ್ನಾಗಿ ಮಾಡುತ್ತದೆ. ಚಿತ್ರಗಳಿಗೆ ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನ್ನು ಹೇಗೆ ಕಾರ್ಯಗತಗೊಳಿಸುವುದು ಎಂಬುದು ಇಲ್ಲಿದೆ:

ನೇಟಿವ್ ಲೇಜಿ ಲೋಡಿಂಗ್

ಆಧುನಿಕ ಬ್ರೌಸರ್‌ಗಳು (Chrome, Firefox, Safari, ಮತ್ತು Edge) ಈಗ loading ಅಟ್ರಿಬ್ಯೂಟ್ ಬಳಸಿ ನೇಟಿವ್ ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನ್ನು ಬೆಂಬಲಿಸುತ್ತವೆ. ಚಿತ್ರಗಳನ್ನು ಲೇಜಿ ಲೋಡ್ ಮಾಡಲು ಇದು ಸರಳ ಮತ್ತು ಅತ್ಯಂತ ಪರಿಣಾಮಕಾರಿ ಮಾರ್ಗವಾಗಿದೆ.

ನೇಟಿವ್ ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನ್ನು ಸಕ್ರಿಯಗೊಳಿಸಲು, ನಿಮ್ಮ <img> ಟ್ಯಾಗ್‌ಗೆ loading="lazy" ಅಟ್ರಿಬ್ಯೂಟ್ ಅನ್ನು ಸೇರಿಸಿ:

<img src="image.jpg" alt="My Image" loading="lazy">

loading ಅಟ್ರಿಬ್ಯೂಟ್ ಮೂರು ಮೌಲ್ಯಗಳನ್ನು ಹೊಂದಿರಬಹುದು:

• lazy: ಚಿತ್ರವು ವ್ಯೂಪೋರ್ಟ್ ಪ್ರವೇಶಿಸಲು ಸಿದ್ಧವಾಗುವವರೆಗೆ ಅದರ ಲೋಡಿಂಗ್ ಅನ್ನು ಮುಂದೂಡಿ.
• eager: ಪುಟದಲ್ಲಿ ಅದರ ಸ್ಥಾನವನ್ನು ಲೆಕ್ಕಿಸದೆ ಚಿತ್ರವನ್ನು ತಕ್ಷಣವೇ ಲೋಡ್ ಮಾಡಿ. (ಅಟ್ರಿಬ್ಯೂಟ್ ಇಲ್ಲದಿದ್ದಲ್ಲಿ ಇದು ಡೀಫಾಲ್ಟ್ ನಡವಳಿಕೆಯಾಗಿದೆ.)
• auto: ಚಿತ್ರವನ್ನು ಲೇಜಿ ಲೋಡ್ ಮಾಡಬೇಕೇ ಎಂದು ಬ್ರೌಸರ್ ನಿರ್ಧರಿಸಲು ಬಿಡಿ.

ಉದಾಹರಣೆ:

<img src="london_bridge.jpg" alt="London Bridge" loading="lazy" width="600" height="400">
<img src="tokyo_skyline.jpg" alt="Tokyo Skyline" loading="lazy" width="600" height="400">
<img src="rio_de_janeiro.jpg" alt="Rio de Janeiro" loading="lazy" width="600" height="400">

ಈ ಉದಾಹರಣೆಯಲ್ಲಿ, ಲಂಡನ್ ಸೇತುವೆ, ಟೋಕಿಯೋ ಸ್ಕೈಲೈನ್, ಮತ್ತು ರಿಯೋ ಡಿ ಜನೈರೊ ಚಿತ್ರಗಳು ಬಳಕೆದಾರರು ಅವುಗಳ ಬಳಿ ಸ್ಕ್ರಾಲ್ ಮಾಡಿದಾಗ ಮಾತ್ರ ಲೋಡ್ ಆಗುತ್ತವೆ. ಬಳಕೆದಾರರು ಪುಟದ ತಳಕ್ಕೆ ಸ್ಕ್ರಾಲ್ ಮಾಡದಿದ್ದರೆ ಇದು ಅತ್ಯಂತ ಸಹಾಯಕವಾಗಿದೆ.

ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್‌ನೊಂದಿಗೆ ಲೇಜಿ ಲೋಡಿಂಗ್

ನೇಟಿವ್ ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನ್ನು ಬೆಂಬಲಿಸದ ಹಳೆಯ ಬ್ರೌಸರ್‌ಗಳಿಗಾಗಿ, ನೀವು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಲೈಬ್ರರಿಗಳನ್ನು ಬಳಸಬಹುದು ಅಥವಾ ನಿಮ್ಮ ಸ್ವಂತ ಕಸ್ಟಮ್ ಸ್ಕ್ರಿಪ್ಟ್ ಅನ್ನು ಬರೆಯಬಹುದು. Intersection Observer API ಬಳಸಿ ಒಂದು ಮೂಲಭೂತ ಉದಾಹರಣೆ ಇಲ್ಲಿದೆ:

const images = document.querySelectorAll('img[data-src]');

const observer = new IntersectionObserver((entries, observer) => {
  entries.forEach(entry => {
    if (entry.isIntersecting) {
      const img = entry.target;
      img.src = img.dataset.src;
      img.removeAttribute('data-src');
      observer.unobserve(img);
    }
  });
});

images.forEach(img => {
  observer.observe(img);
});

ವಿವರಣೆ:

1. ನಾವು data-src ಅಟ್ರಿಬ್ಯೂಟ್ ಹೊಂದಿರುವ ಎಲ್ಲಾ <img> ಎಲಿಮೆಂಟ್‌ಗಳನ್ನು ಆಯ್ಕೆ ಮಾಡುತ್ತೇವೆ.
2. ನಾವು ಹೊಸ IntersectionObserver ಇನ್‌ಸ್ಟಾನ್ಸ್ ಅನ್ನು ರಚಿಸುತ್ತೇವೆ. ಗಮನಿಸಿದ ಎಲಿಮೆಂಟ್ ವ್ಯೂಪೋರ್ಟ್ ಅನ್ನು ಪ್ರವೇಶಿಸಿದಾಗ ಅಥವಾ ನಿರ್ಗಮಿಸಿದಾಗ ಕಾಲ್‌ಬ್ಯಾಕ್ ಫಂಕ್ಷನ್ ಕಾರ್ಯಗತಗೊಳ್ಳುತ್ತದೆ.
3. ಕಾಲ್‌ಬ್ಯಾಕ್ ಫಂಕ್ಷನ್‌ನ ಒಳಗೆ, ನಾವು entries (ವ್ಯೂಪೋರ್ಟ್ ಅನ್ನು ಛೇದಿಸಿದ ಎಲಿಮೆಂಟ್‌ಗಳು) ಮೇಲೆ ಪುನರಾವರ್ತಿಸುತ್ತೇವೆ.
4. ಒಂದು ಎಲಿಮೆಂಟ್ ಛೇದಿಸುತ್ತಿದ್ದರೆ (entry.isIntersecting is true), ನಾವು ಚಿತ್ರದ src ಅಟ್ರಿಬ್ಯೂಟ್ ಅನ್ನು data-src ಅಟ್ರಿಬ್ಯೂಟ್‌ನ ಮೌಲ್ಯಕ್ಕೆ ಹೊಂದಿಸುತ್ತೇವೆ.
5. ನಂತರ ನಾವು data-src ಅಟ್ರಿಬ್ಯೂಟ್ ಅನ್ನು ತೆಗೆದುಹಾಕುತ್ತೇವೆ ಮತ್ತು ಚಿತ್ರವನ್ನು ಗಮನಿಸುವುದನ್ನು ನಿಲ್ಲಿಸುತ್ತೇವೆ, ಏಕೆಂದರೆ ಅದಕ್ಕೀಗ ಅಗತ್ಯವಿಲ್ಲ.
6. ಅಂತಿಮವಾಗಿ, ನಾವು observer.observe(img) ಬಳಸಿ ಪ್ರತಿ ಚಿತ್ರವನ್ನು ಗಮನಿಸುತ್ತೇವೆ.

HTML ರಚನೆ:

<img data-src="image.jpg" alt="My Image">

ನಿಜವಾದ ಚಿತ್ರದ URL ಅನ್ನು src ಅಟ್ರಿಬ್ಯೂಟ್ ಬದಲಿಗೆ data-src ಅಟ್ರಿಬ್ಯೂಟ್‌ನಲ್ಲಿ ಇರಿಸಲಾಗಿದೆ ಎಂಬುದನ್ನು ಗಮನಿಸಿ. ಇದು ಬ್ರೌಸರ್ ತಕ್ಷಣವೇ ಚಿತ್ರವನ್ನು ಲೋಡ್ ಮಾಡುವುದನ್ನು ತಡೆಯುತ್ತದೆ.

ಲೇಜಿ ಲೋಡಿಂಗ್ ಲೈಬ್ರರಿಗಳನ್ನು ಬಳಸುವುದು

ಹಲವಾರು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಲೈಬ್ರರಿಗಳು ಚಿತ್ರಗಳನ್ನು ಲೇಜಿ ಲೋಡ್ ಮಾಡುವ ಪ್ರಕ್ರಿಯೆಯನ್ನು ಸರಳಗೊಳಿಸಬಹುದು. ಕೆಲವು ಜನಪ್ರಿಯ ಆಯ್ಕೆಗಳು ಸೇರಿವೆ:

• Lozad.js: ಒಂದು ಹಗುರವಾದ ಮತ್ತು ಅವಲಂಬನೆ-ರಹಿತ ಲೇಜಿ ಲೋಡಿಂಗ್ ಲೈಬ್ರರಿ.
• yall.js: Yet Another Lazy Loader. Intersection Observer ಬಳಸುವ ಒಂದು ಆಧುನಿಕ ಲೇಜಿ ಲೋಡಿಂಗ್ ಲೈಬ್ರರಿ.
• React Lazy Load: ಚಿತ್ರಗಳು ಮತ್ತು ಇತರ ಕಾಂಪೊನೆಂಟ್‌ಗಳನ್ನು ಲೇಜಿ ಲೋಡ್ ಮಾಡಲು ಒಂದು ರಿಯಾಕ್ಟ್ ಕಾಂಪೊನೆಂಟ್.

ಈ ಲೈಬ್ರರಿಗಳು ಸಾಮಾನ್ಯವಾಗಿ ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನ್ನು ಪ್ರಾರಂಭಿಸಲು ಸರಳವಾದ API ಅನ್ನು ಒದಗಿಸುತ್ತವೆ ಮತ್ತು ಪ್ಲೇಸ್‌ಹೋಲ್ಡರ್ ಚಿತ್ರಗಳು ಮತ್ತು ಪರಿವರ್ತನೆಯ ಪರಿಣಾಮಗಳಂತಹ ಹೆಚ್ಚುವರಿ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ನೀಡುತ್ತವೆ.

ಲೇಜಿ ಲೋಡಿಂಗ್ ಕಾಂಪೊನೆಂಟ್‌ಗಳು

ಲೇಜಿ ಲೋಡಿಂಗ್ ಕೇವಲ ಚಿತ್ರಗಳಿಗೆ ಸೀಮಿತವಲ್ಲ; ಇದನ್ನು ಕಾಂಪೊನೆಂಟ್‌ಗಳಿಗೂ ಅನ್ವಯಿಸಬಹುದು, ವಿಶೇಷವಾಗಿ ರಿಯಾಕ್ಟ್, ಆಂಗ್ಯುಲರ್, ಮತ್ತು ವ್ಯೂ ನಂತಹ ಆಧುನಿಕ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಫ್ರೇಮ್‌ವರ್ಕ್‌ಗಳಲ್ಲಿ. ಇದು ಅನೇಕ ಕಾಂಪೊನೆಂಟ್‌ಗಳನ್ನು ಹೊಂದಿರುವ ದೊಡ್ಡ ಸಿಂಗಲ್-ಪೇಜ್ ಅಪ್ಲಿಕೇಶನ್‌ಗಳಿಗೆ (SPAs) ವಿಶೇಷವಾಗಿ ಉಪಯುಕ್ತವಾಗಿದೆ.

ರಿಯಾಕ್ಟ್‌ನಲ್ಲಿ ಲೇಜಿ ಲೋಡಿಂಗ್

ರಿಯಾಕ್ಟ್ ಕಾಂಪೊನೆಂಟ್‌ಗಳನ್ನು ಲೇಜಿ ಲೋಡ್ ಮಾಡಲು ಅಂತರ್ನಿರ್ಮಿತ React.lazy() ಫಂಕ್ಷನ್ ಅನ್ನು ಒದಗಿಸುತ್ತದೆ. ಈ ಫಂಕ್ಷನ್ ನಿಮಗೆ ಕಾಂಪೊನೆಂಟ್‌ಗಳನ್ನು ಡೈನಾಮಿಕ್ ಆಗಿ ಇಂಪೋರ್ಟ್ ಮಾಡಲು ಅನುಮತಿಸುತ್ತದೆ, ಅವುಗಳು ರೆಂಡರ್ ಆದಾಗ ಮಾತ್ರ ಲೋಡ್ ಆಗುತ್ತವೆ.

import React, { Suspense } from 'react';

const MyComponent = React.lazy(() => import('./MyComponent'));

function App() {
  return (
    <Suspense fallback={<div>Loading...</div>}>
      <MyComponent />
    </Suspense>
  );
}

export default App;

ವಿವರಣೆ:

1. MyComponent ಅನ್ನು ಡೈನಾಮಿಕ್ ಆಗಿ ಇಂಪೋರ್ಟ್ ಮಾಡಲು ನಾವು React.lazy() ಅನ್ನು ಬಳಸುತ್ತೇವೆ. import() ಫಂಕ್ಷನ್ ಒಂದು ಪ್ರಾಮಿಸ್ ಅನ್ನು ಹಿಂತಿರುಗಿಸುತ್ತದೆ, ಅದು ಕಾಂಪೊನೆಂಟ್ ಮಾಡ್ಯೂಲ್‌ಗೆ ಪರಿಹಾರವಾಗುತ್ತದೆ.
2. ನಾವು MyComponent ಅನ್ನು <Suspense> ಕಾಂಪೊನೆಂಟ್‌ನಲ್ಲಿ ಸುತ್ತುತ್ತೇವೆ. Suspense ಕಾಂಪೊನೆಂಟ್ ಕಾಂಪೊನೆಂಟ್ ಲೋಡ್ ಆಗುತ್ತಿರುವಾಗ ಫಾಲ್‌ಬ್ಯಾಕ್ UI (ಈ ಸಂದರ್ಭದಲ್ಲಿ, "Loading...") ಅನ್ನು ಪ್ರದರ್ಶಿಸಲು ನಿಮಗೆ ಅನುಮತಿಸುತ್ತದೆ.

ಆಂಗ್ಯುಲರ್‌ನಲ್ಲಿ ಲೇಜಿ ಲೋಡಿಂಗ್

ಆಂಗ್ಯುಲರ್ ರೂಟಿಂಗ್ ಕಾನ್ಫಿಗರೇಶನ್‌ನಲ್ಲಿ loadChildren ಪ್ರಾಪರ್ಟಿ ಬಳಸಿ ಮಾಡ್ಯೂಲ್‌ಗಳ ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನ್ನು ಬೆಂಬಲಿಸುತ್ತದೆ.

const routes: Routes = [
  {
    path: 'my-module',
    loadChildren: () => import('./my-module/my-module.module').then(m => m.MyModuleModule)
  }
];

ವಿವರಣೆ:

1. ನಾವು my-module ಪಾಥ್‌ಗಾಗಿ ಒಂದು ರೂಟ್ ಅನ್ನು ವ್ಯಾಖ್ಯಾನಿಸುತ್ತೇವೆ.
2. MyModuleModule ಅನ್ನು ಲೇಜಿ ಲೋಡ್ ಮಾಡಬೇಕು ಎಂದು ನಿರ್ದಿಷ್ಟಪಡಿಸಲು ನಾವು loadChildren ಪ್ರಾಪರ್ಟಿಯನ್ನು ಬಳಸುತ್ತೇವೆ. import() ಫಂಕ್ಷನ್ ಮಾಡ್ಯೂಲ್ ಅನ್ನು ಡೈನಾಮಿಕ್ ಆಗಿ ಇಂಪೋರ್ಟ್ ಮಾಡುತ್ತದೆ.
3. then() ಮೆಥೆಡ್ ಅನ್ನು ಮಾಡ್ಯೂಲ್ ಅನ್ನು ಪ್ರವೇಶಿಸಲು ಮತ್ತು MyModuleModule ಕ್ಲಾಸ್ ಅನ್ನು ಹಿಂತಿರುಗಿಸಲು ಬಳಸಲಾಗುತ್ತದೆ.

ವ್ಯೂ.ಜೆಎಸ್‌ನಲ್ಲಿ ಲೇಜಿ ಲೋಡಿಂಗ್

ವ್ಯೂ.ಜೆಎಸ್ ಡೈನಾಮಿಕ್ ಇಂಪೋರ್ಟ್‌ಗಳು ಮತ್ತು component ಟ್ಯಾಗ್ ಬಳಸಿ ಕಾಂಪೊನೆಂಟ್‌ಗಳ ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನ್ನು ಬೆಂಬಲಿಸುತ್ತದೆ.

<template>
  <component :is="dynamicComponent"></component>
</template>

<script>
export default {
  data() {
    return {
      dynamicComponent: null
    }
  },
  mounted() {
    import('./MyComponent.vue')
      .then(module => {
        this.dynamicComponent = module.default
      })
  }
}
</script>

ವಿವರಣೆ:

1. ನಾವು ಕಾಂಪೊನೆಂಟ್ ಅನ್ನು ಡೈನಾಮಿಕ್ ಆಗಿ ರೆಂಡರ್ ಮಾಡಲು :is ಅಟ್ರಿಬ್ಯೂಟ್‌ನೊಂದಿಗೆ <component> ಟ್ಯಾಗ್ ಅನ್ನು ಬಳಸುತ್ತೇವೆ.
2. mounted ಲೈಫ್‌ಸೈಕಲ್ ಹುಕ್‌ನಲ್ಲಿ, ನಾವು MyComponent.vue ಅನ್ನು ಡೈನಾಮಿಕ್ ಆಗಿ ಇಂಪೋರ್ಟ್ ಮಾಡಲು import() ಫಂಕ್ಷನ್ ಅನ್ನು ಬಳಸುತ್ತೇವೆ.
3. ನಂತರ ನಾವು dynamicComponent ಡೇಟಾ ಪ್ರಾಪರ್ಟಿಯನ್ನು ಮಾಡ್ಯೂಲ್‌ನ ಡೀಫಾಲ್ಟ್ ಎಕ್ಸ್‌ಪೋರ್ಟ್‌ಗೆ ಹೊಂದಿಸುತ್ತೇವೆ.

ಲೇಜಿ ಲೋಡಿಂಗ್‌ಗಾಗಿ ಉತ್ತಮ ಅಭ್ಯಾಸಗಳು

ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನ್ನು ಪರಿಣಾಮಕಾರಿಯಾಗಿ ಕಾರ್ಯಗತಗೊಳಿಸಲಾಗಿದೆ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು, ಈ ಉತ್ತಮ ಅಭ್ಯಾಸಗಳನ್ನು ಪರಿಗಣಿಸಿ:

• ಸಾಧ್ಯವಾದಾಗ ನೇಟಿವ್ ಲೇಜಿ ಲೋಡಿಂಗ್ ಬಳಸಿ: ನೀವು ಆಧುನಿಕ ಬ್ರೌಸರ್‌ಗಳನ್ನು ಗುರಿಯಾಗಿಸಿಕೊಂಡಿದ್ದರೆ, ಚಿತ್ರಗಳು ಮತ್ತು ಐಫ್ರೇಮ್‌ಗಳಿಗಾಗಿ ನೇಟಿವ್ loading ಅಟ್ರಿಬ್ಯೂಟ್ ಬಳಸಿ.
• ಸರಿಯಾದ ಲೈಬ್ರರಿಯನ್ನು ಆರಿಸಿ: ನೀವು ಹಳೆಯ ಬ್ರೌಸರ್‌ಗಳನ್ನು ಬೆಂಬಲಿಸಬೇಕಾದರೆ ಅಥವಾ ಹೆಚ್ಚುವರಿ ವೈಶಿಷ್ಟ್ಯಗಳು ಅಗತ್ಯವಿದ್ದರೆ, ಉತ್ತಮವಾಗಿ ನಿರ್ವಹಿಸಲ್ಪಡುವ ಮತ್ತು ಹಗುರವಾದ ಲೇಜಿ ಲೋಡಿಂಗ್ ಲೈಬ್ರರಿಯನ್ನು ಆಯ್ಕೆ ಮಾಡಿ.
• ಪ್ಲೇಸ್‌ಹೋಲ್ಡರ್‌ಗಳನ್ನು ಬಳಸಿ: ಸಂಪನ್ಮೂಲಗಳು ಲೋಡ್ ಆಗುತ್ತಿದ್ದಂತೆ ವಿಷಯವು ಸ್ಥಳಾಂತರಗೊಳ್ಳುವುದನ್ನು ತಡೆಯಲು ಪ್ಲೇಸ್‌ಹೋಲ್ಡರ್ ಚಿತ್ರಗಳು ಅಥವಾ UI ಎಲಿಮೆಂಟ್‌ಗಳನ್ನು ಒದಗಿಸಿ. ಇದು ಬಳಕೆದಾರರ ಅನುಭವವನ್ನು ಸುಧಾರಿಸುತ್ತದೆ ಮತ್ತು ಲೇಔಟ್ ಅಸ್ಥಿರತೆಯನ್ನು ಕಡಿಮೆ ಮಾಡುತ್ತದೆ. ತುಂಬಾ ಚಿಕ್ಕ (ಕಡಿಮೆ KB ಗಾತ್ರ) ಪ್ಲೇಸ್‌ಹೋಲ್ಡರ್ ಚಿತ್ರಗಳನ್ನು ಬಳಸಿ, ಅಥವಾ ಅಂತಿಮವಾಗಿ ಲೋಡ್ ಆಗುವ ಚಿತ್ರದ ಸರಾಸರಿ ಬಣ್ಣಕ್ಕೆ ಹೊಂದುವ ಘನ ಬಣ್ಣದ ಬ್ಲಾಕ್‌ಗಳನ್ನು ಬಳಸಿ.
• ಚಿತ್ರಗಳನ್ನು ಉತ್ತಮಗೊಳಿಸಿ: ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನ್ನು ಕಾರ್ಯಗತಗೊಳಿಸುವ ಮೊದಲು, ನಿಮ್ಮ ಚಿತ್ರಗಳನ್ನು ಕಂಪ್ರೆಸ್ ಮಾಡುವ ಮೂಲಕ ಮತ್ತು ಸೂಕ್ತವಾದ ಫೈಲ್ ಫಾರ್ಮ್ಯಾಟ್‌ಗಳನ್ನು (ಉದಾ., WebP, JPEG, PNG) ಬಳಸುವ ಮೂಲಕ ಉತ್ತಮಗೊಳಿಸಿ.
• ಸಂಪೂರ್ಣವಾಗಿ ಪರೀಕ್ಷಿಸಿ: ನಿಮ್ಮ ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನುಷ್ಠಾನವು ಸರಿಯಾಗಿ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತಿದೆಯೇ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ವಿವಿಧ ಬ್ರೌಸರ್‌ಗಳು, ಸಾಧನಗಳು ಮತ್ತು ನೆಟ್‌ವರ್ಕ್ ಪರಿಸ್ಥಿತಿಗಳಲ್ಲಿ ಪರೀಕ್ಷಿಸಿ. ಚಿತ್ರಗಳು ಲೋಡ್ ಆಗಲು ಹೆಚ್ಚು ಸಮಯ ತೆಗೆದುಕೊಳ್ಳುತ್ತಿಲ್ಲ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ಕೆಳಮಟ್ಟದ ಸಾಧನಗಳಲ್ಲಿ (ಸಾಮಾನ್ಯವಾಗಿ ಹಳೆಯ ಫೋನ್‌ಗಳು) ಬಳಕೆದಾರರ ಬಗ್ಗೆ ಗಮನ ಕೊಡಿ.
• ಫೋಲ್ಡ್ ಅನ್ನು ಪರಿಗಣಿಸಿ: ಫೋಲ್ಡ್‌ನ ಮೇಲಿರುವ (ಆರಂಭಿಕ ಪುಟ ಲೋಡ್‌ನಲ್ಲಿ ಗೋಚರಿಸುವ) ಎಲಿಮೆಂಟ್‌ಗಳಿಗೆ, ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನ್ನು ತಪ್ಪಿಸಿ. ವೇಗದ ಆರಂಭಿಕ ರೆಂಡರಿಂಗ್ ಅನ್ನು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ಈ ಎಲಿಮೆಂಟ್‌ಗಳನ್ನು ತಕ್ಷಣವೇ ಲೋಡ್ ಮಾಡಬೇಕು.
• ನಿರ್ಣಾಯಕ ಸಂಪನ್ಮೂಲಗಳಿಗೆ ಆದ್ಯತೆ ನೀಡಿ: ಆರಂಭಿಕ ಬಳಕೆದಾರರ ಅನುಭವಕ್ಕೆ ಅತ್ಯಗತ್ಯವಾದ ನಿರ್ಣಾಯಕ ಸಂಪನ್ಮೂಲಗಳನ್ನು ಗುರುತಿಸಿ ಮತ್ತು ಅವುಗಳನ್ನು ತಕ್ಷಣವೇ ಲೋಡ್ ಮಾಡಿ. ಇದು ವೆಬ್‌ಸೈಟ್ ಲೋಗೋ, ನ್ಯಾವಿಗೇಷನ್ ಎಲಿಮೆಂಟ್‌ಗಳು ಮತ್ತು ಪುಟದ ಮುಖ್ಯ ವಿಷಯವನ್ನು ಒಳಗೊಂಡಿರಬಹುದು.
• ಕಾರ್ಯಕ್ಷಮತೆಯನ್ನು ಮೇಲ್ವಿಚಾರಣೆ ಮಾಡಿ: ನಿಮ್ಮ ವೆಬ್‌ಸೈಟ್‌ನ ಕಾರ್ಯಕ್ಷಮತೆಯ ಮೇಲೆ ಲೇಜಿ ಲೋಡಿಂಗ್‌ನ ಪ್ರಭಾವವನ್ನು ಟ್ರ್ಯಾಕ್ ಮಾಡಲು ಕಾರ್ಯಕ್ಷಮತೆ ಮೇಲ್ವಿಚಾರಣಾ ಸಾಧನಗಳನ್ನು ಬಳಸಿ. ಇದು ಯಾವುದೇ ಸಮಸ್ಯೆಗಳನ್ನು ಗುರುತಿಸಲು ಮತ್ತು ನಿಮ್ಮ ಅನುಷ್ಠಾನವನ್ನು ಉತ್ತಮಗೊಳಿಸಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ. ಗೂಗಲ್‌ನ PageSpeed Insights ಮತ್ತು WebPageTest ಸೈಟ್ ಕಾರ್ಯಕ್ಷಮತೆಯನ್ನು ಅಳೆಯಲು ಉತ್ತಮ ಉಚಿತ ಸಾಧನಗಳಾಗಿವೆ.

ಅಂತರರಾಷ್ಟ್ರೀಕರಣದ ಪರಿಗಣನೆಗಳು

ಜಾಗತಿಕ ಪ್ರೇಕ್ಷಕರಿಗಾಗಿ ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನ್ನು ಕಾರ್ಯಗತಗೊಳಿಸುವಾಗ, ಈ ಅಂತರರಾಷ್ಟ್ರೀಕರಣದ ಅಂಶಗಳನ್ನು ಪರಿಗಣಿಸಿ:

• ವಿವಿಧ ನೆಟ್‌ವರ್ಕ್ ವೇಗಗಳು: ವಿವಿಧ ಪ್ರದೇಶಗಳಲ್ಲಿನ ಬಳಕೆದಾರರು ಗಮನಾರ್ಹವಾಗಿ ವಿಭಿನ್ನ ನೆಟ್‌ವರ್ಕ್ ವೇಗಗಳನ್ನು ಹೊಂದಿರಬಹುದು. ನಿಧಾನಗತಿಯ ಸಂಪರ್ಕಗಳನ್ನು ಗಣನೆಗೆ ತೆಗೆದುಕೊಳ್ಳಲು ನಿಮ್ಮ ಲೇಜಿ ಲೋಡಿಂಗ್ ತಂತ್ರವನ್ನು ಉತ್ತಮಗೊಳಿಸಿ.
• ಡೇಟಾ ವೆಚ್ಚಗಳು: ಕೆಲವು ಪ್ರದೇಶಗಳಲ್ಲಿ, ಡೇಟಾ ವೆಚ್ಚಗಳು ಹೆಚ್ಚಾಗಿರುತ್ತವೆ. ಲೇಜಿ ಲೋಡಿಂಗ್ ಡೇಟಾ ಬಳಕೆಯನ್ನು ಕಡಿಮೆ ಮಾಡಲು ಮತ್ತು ಸೀಮಿತ ಡೇಟಾ ಯೋಜನೆಗಳನ್ನು ಹೊಂದಿರುವ ಬಳಕೆದಾರರಿಗೆ ಬಳಕೆದಾರರ ಅನುಭವವನ್ನು ಸುಧಾರಿಸಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ.
• ಸಾಧನ ಸಾಮರ್ಥ್ಯಗಳು: ವಿವಿಧ ಪ್ರದೇಶಗಳಲ್ಲಿನ ಬಳಕೆದಾರರು ವಿವಿಧ ಸಾಮರ್ಥ್ಯಗಳೊಂದಿಗೆ ವಿಭಿನ್ನ ಸಾಧನಗಳನ್ನು ಬಳಸಬಹುದು. ನಿಮ್ಮ ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನುಷ್ಠಾನವು ಸರಿಯಾಗಿ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ಅದನ್ನು ವಿವಿಧ ಸಾಧನಗಳಲ್ಲಿ ಪರೀಕ್ಷಿಸಿ.
• ಕಂಟೆಂಟ್ ಡೆಲಿವರಿ ನೆಟ್‌ವರ್ಕ್‌ಗಳು (CDNs): ನಿಮ್ಮ ವೆಬ್‌ಸೈಟ್‌ನ ಆಸ್ತಿಗಳನ್ನು ಪ್ರಪಂಚದಾದ್ಯಂತ ಇರುವ ಸರ್ವರ್‌ಗಳಿಂದ ತಲುಪಿಸಲು CDN ಬಳಸಿ. ಇದು ವಿವಿಧ ಪ್ರದೇಶಗಳಲ್ಲಿನ ಬಳಕೆದಾರರಿಗೆ ಕಾರ್ಯಕ್ಷಮತೆಯನ್ನು ಸುಧಾರಿಸಬಹುದು. ಉದಾಹರಣೆಗೆ, ಯುರೋಪಿಯನ್ ಹೆಗ್ಗುರುತುಗಳ ಚಿತ್ರಗಳನ್ನು ಸಾಧ್ಯವಾದಾಗಲೆಲ್ಲಾ EU ಬಳಕೆದಾರರಿಗಾಗಿ ಯುರೋಪ್‌ನಲ್ಲಿನ CDN ಎಂಡ್‌ಪಾಯಿಂಟ್‌ನಿಂದ ಪೂರೈಸಬೇಕು.
• ಚಿತ್ರ ಫಾರ್ಮ್ಯಾಟ್‌ಗಳು: WebP ನಂತಹ ಆಧುನಿಕ ಚಿತ್ರ ಫಾರ್ಮ್ಯಾಟ್‌ಗಳನ್ನು ಬಳಸುವುದನ್ನು ಪರಿಗಣಿಸಿ, ಇದು JPEG ಮತ್ತು PNG ನಂತಹ ಸಾಂಪ್ರದಾಯಿಕ ಫಾರ್ಮ್ಯಾಟ್‌ಗಳಿಗಿಂತ ಉತ್ತಮ ಕಂಪ್ರೆಷನ್ ಮತ್ತು ಗುಣಮಟ್ಟವನ್ನು ನೀಡುತ್ತದೆ. ಆದಾಗ್ಯೂ, ಬ್ರೌಸರ್ ಹೊಂದಾಣಿಕೆಯ ಬಗ್ಗೆ ತಿಳಿದಿರಲಿ; WebP ಅನ್ನು ಬೆಂಬಲಿಸದ ಹಳೆಯ ಬ್ರೌಸರ್‌ಗಳಿಗೆ ಸೂಕ್ತವಾದ ಫಾಲ್‌ಬ್ಯಾಕ್‌ಗಳನ್ನು ಬಳಸಿ.
• ಪ್ರವೇಶಿಸುವಿಕೆ: ನಿಮ್ಮ ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನುಷ್ಠಾನವು ಅಂಗವೈಕಲ್ಯ ಹೊಂದಿರುವ ಬಳಕೆದಾರರಿಗೆ ಪ್ರವೇಶಿಸಬಹುದಾಗಿದೆ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಿ. ಚಿತ್ರಗಳಿಗೆ ಸೂಕ್ತವಾದ alt ಟೆಕ್ಸ್ಟ್ ಅನ್ನು ಒದಗಿಸಿ ಮತ್ತು ಲೋಡಿಂಗ್ ಸ್ಥಿತಿಯನ್ನು ಸಹಾಯಕ ತಂತ್ರಜ್ಞಾನಗಳಿಗೆ ಸಂವಹನ ಮಾಡಲಾಗಿದೆಯೆ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಿ.

ತೀರ್ಮಾನ

ಲೇಜಿ ಲೋಡಿಂಗ್ ವೆಬ್‌ಸೈಟ್ ಕಾರ್ಯಕ್ಷಮತೆಯನ್ನು ಉತ್ತಮಗೊಳಿಸಲು ಮತ್ತು ಬಳಕೆದಾರರ ಅನುಭವವನ್ನು ಸುಧಾರಿಸಲು ಒಂದು ಶಕ್ತಿಯುತ ತಂತ್ರವಾಗಿದೆ. ಪರದೆಯಾಚೆಯ ಸಂಪನ್ಮೂಲಗಳ ಲೋಡಿಂಗ್ ಅನ್ನು ಮುಂದೂಡುವುದರಿಂದ, ನೀವು ಆರಂಭಿಕ ಪುಟ ಲೋಡ್ ಸಮಯವನ್ನು ಕಡಿಮೆ ಮಾಡಬಹುದು, ಬ್ಯಾಂಡ್‌ವಿಡ್ತ್ ಬಳಕೆಯನ್ನು ತಗ್ಗಿಸಬಹುದು, ಮತ್ತು ಸರ್ವರ್ ಲೋಡ್ ಅನ್ನು ಕಡಿಮೆ ಮಾಡಬಹುದು. ನೀವು ಸಣ್ಣ ವೈಯಕ್ತಿಕ ವೆಬ್‌ಸೈಟ್ ಅಥವಾ ದೊಡ್ಡ ಉದ್ಯಮ ಅಪ್ಲಿಕೇಶನ್ ಅನ್ನು ನಿರ್ಮಿಸುತ್ತಿರಲಿ, ಲೇಜಿ ಲೋಡಿಂಗ್ ನಿಮ್ಮ ಕಾರ್ಯಕ್ಷಮತೆ ಆಪ್ಟಿಮೈಸೇಶನ್ ತಂತ್ರದ ಪ್ರಮುಖ ಭಾಗವಾಗಿರಬೇಕು. ಈ ಲೇಖನದಲ್ಲಿ ವಿವರಿಸಿದ ಉತ್ತಮ ಅಭ್ಯಾಸಗಳನ್ನು ಅನುಸರಿಸುವ ಮೂಲಕ ಮತ್ತು ಅಂತರರಾಷ್ಟ್ರೀಕರಣದ ಅಂಶಗಳನ್ನು ಪರಿಗಣಿಸುವ ಮೂಲಕ, ನಿಮ್ಮ ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನುಷ್ಠಾನವು ಪರಿಣಾಮಕಾರಿಯಾಗಿದೆ ಮತ್ತು ಜಾಗತಿಕ ಪ್ರೇಕ್ಷಕರಿಗೆ ಸಕಾರಾತ್ಮಕ ಬಳಕೆದಾರ ಅನುಭವವನ್ನು ಒದಗಿಸುತ್ತದೆ ಎಂದು ನೀವು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಬಹುದು.

ಲೇಜಿ ಲೋಡಿಂಗ್ ಅನ್ನು ಅಳವಡಿಸಿಕೊಳ್ಳಿ ಮತ್ತು ಎಲ್ಲರಿಗೂ ವೇಗವಾದ, ಹೆಚ್ಚು ಸಮರ್ಥ ಮತ್ತು ಬಳಕೆದಾರ-ಸ್ನೇಹಿ ವೆಬ್ ಅನುಭವವನ್ನು ಅನ್ಲಾಕ್ ಮಾಡಿ.