{"id":15496465,"url":"https://github.com/imranhsayed/lazy-load","last_synced_at":"2025-07-22T23:36:07.014Z","repository":{"id":97032707,"uuid":"222729106","full_name":"imranhsayed/lazy-load","owner":"imranhsayed","description":"🌈 A WordPress theme to demonstrate lazy load feature","archived":false,"fork":false,"pushed_at":"2019-11-20T03:54:02.000Z","size":42743,"stargazers_count":7,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-06-03T12:06:28.159Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/imranhsayed.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-11-19T15:32:26.000Z","updated_at":"2022-09-13T10:01:24.000Z","dependencies_parsed_at":null,"dependency_job_id":"871fa0c6-5978-4fa5-bc7a-8dff931419a1","html_url":"https://github.com/imranhsayed/lazy-load","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/imranhsayed/lazy-load","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/imranhsayed%2Flazy-load","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/imranhsayed%2Flazy-load/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/imranhsayed%2Flazy-load/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/imranhsayed%2Flazy-load/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/imranhsayed","download_url":"https://codeload.github.com/imranhsayed/lazy-load/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/imranhsayed%2Flazy-load/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266591050,"owners_count":23953046,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-07-22T02:00:09.085Z","response_time":66,"last_error":null,"robots_txt_status":null,"robots_txt_updated_at":null,"robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-02T08:25:20.821Z","updated_at":"2025-07-22T23:36:06.935Z","avatar_url":"https://github.com/imranhsayed.png","language":"PHP","readme":"## Lazy Load\n\nWordPress theme to demonstrate lazy load\n\n## Demo\n\n![](lazy-load.gif)\n\n## The Concept\n\nWe first add the lightweight image URL in the src and srset attributes, and the actual image URL and actual srcset into data-src and data-srcset respectively.\nOn initial page load, on window resize, scroll and change in orientation we call the lazyload() with debounce.\nThe lazy load function loops through each image on the page and checks if its in the viewport .\nIf it is in the viewport, takes the original image URLs from the data-src and data-srcset attributes and replace the lightweight image with the original one, so we get a blur effect.\nWe will also add a image container with off-white background and a proper set height( using padding in % ) so it shows when while the images are being loaded.\n\n******* PLEASE STAR MY REPO TO SUPPORT ME ******\n\nPlease follow 🙏\n\nTwitter - [@imranhsayed](https://twitter.com/imranhsayed)\n\nGithub - [imranhsayed](https://github.com/imranhsayed)\n\n## Demo 2\n\n![](lazy-load-2.gif)\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fimranhsayed%2Flazy-load","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fimranhsayed%2Flazy-load","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fimranhsayed%2Flazy-load/lists"}