How to make website loads faster

Best Webdesign - website loads faster - website load

one of the Best Webdesign is making website loads faster

How to make website loads faster

As the Best Webdesign, we often face website loads slowly, because it has to wait for long time to download whole contents such as CSS, Javascript, and images. This content must be downloaded first before the browser shows the content.

Now, we will earn how to tell the browser to not download whole images on the website directly. The technique is called lazy load.
By using this technique, the images are not downloaded directly when we open the website. The image will be downloaded when we scroll to the point where the images exist.

Read: Checking Password Strength with pStrength jQuery Plugin

Read: Checking Password Strength with pStrength jQuery Plugin

Generally, we use the below HTML code to call the image:

<img src="images/blabla.jpg">

By using this code, browser will download the image when we open the website. The more images are, the longer we need to see the content of the website.

Using lazy load we modify the code with the one below:

<img data-src="images/blabla.jpg" class="lazy">

With this code, browser will not download the image directly when we open the website, so automatically browser just download CSS, Javascript, and HTML code.

How to show the image on scrolling?
We need to use Javascript code to do that.

Read: Checking Password Strength with pStrength jQuery Plugin

Javascript Code:

document.addEventListener("DOMContentLoaded", function() {
  var lazyloadImages;    

  if ("IntersectionObserver" in window) {
    lazyloadImages = document.querySelectorAll(".lazy");
    var imageObserver = new IntersectionObserver(function(entries, observer) {
      entries.forEach(function(entry) {
        if (entry.isIntersecting) {
          var image =;
          image.src = image.dataset.src;

    lazyloadImages.forEach(function(image) {
  } else {  
    var lazyloadThrottleTimeout;
    lazyloadImages = document.querySelectorAll(".lazy");
    function lazyload () {
      if(lazyloadThrottleTimeout) {

      lazyloadThrottleTimeout = setTimeout(function() {
        var scrollTop = window.pageYOffset;
        lazyloadImages.forEach(function(img) {
            if(img.offsetTop < (window.innerHeight + scrollTop)) {
              img.src = img.dataset.src;
        if(lazyloadImages.length == 0) { 
          document.removeEventListener("scroll", lazyload);
          window.removeEventListener("resize", lazyload);
          window.removeEventListener("orientationChange", lazyload);
      }, 20);

    document.addEventListener("scroll", lazyload);
    window.addEventListener("resize", lazyload);
    window.addEventListener("orientationChange", lazyload);

You can see the demo of one Best Webdesign:



Related Article

Web Design Services - Best Webdesign - Best SEO Services

The usage of Bootstrap-DateTimePicker for Date Range

Hallo now, we as Web Design Surabaya wants to give the tutorial about the usage of bootstrap-datetimepicker for choosing check in and check out date. You do not only choose the date range but also the date and time range. To run the tutorial of date ...

Getting current total and previous one from MySQL

As the part of the Best Webdesign, we ever get the request from our customer to show the total selling in a month including previous selling to count the percentage of profit.. To do that, we often use a very simple way, namely using two queris of M ...

CSS Trunk Text

In the web design development, we often show the last article in our site or our customer's site.By using CSS Bootstrap, it is easy because we can make the column easily. The HTML sample that we often use is like below: [adsense] <div class="co ...

Working Process

Web Design - Wedding Photography - Wedding Videography

Our Location at Surabaya and Bali

Website Design in Indonesia

Graphic Design in Indonesia


+628113638531 / +628113865464

Webdesigner in Indonesia

Videographer in Bali


Tatamedia Solusindo Surabaya

Dekkophotography Bali

Fine Art Photography in Bali

Web Design


Send your request to