{"id":20993294,"url":"https://github.com/nestednet/lazier","last_synced_at":"2025-09-09T07:49:01.537Z","repository":{"id":127140634,"uuid":"120324237","full_name":"Nestednet/lazier","owner":"Nestednet","description":"Lazier.js - lazy loading images","archived":false,"fork":false,"pushed_at":"2019-05-09T11:10:48.000Z","size":9996,"stargazers_count":3,"open_issues_count":0,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-09-01T19:46:57.495Z","etag":null,"topics":["images","javascript","javascript-library","lazy-loading","lazyload","lazyload-images"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Nestednet.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":"2018-02-05T15:37:01.000Z","updated_at":"2021-02-10T11:40:01.000Z","dependencies_parsed_at":null,"dependency_job_id":"3a8c7532-3439-4050-86e1-91eeed559994","html_url":"https://github.com/Nestednet/lazier","commit_stats":{"total_commits":22,"total_committers":3,"mean_commits":7.333333333333333,"dds":0.2272727272727273,"last_synced_commit":"376277b2cc66a4dee8b3a2e2a3278e13a32e7dbf"},"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"purl":"pkg:github/Nestednet/lazier","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Nestednet%2Flazier","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Nestednet%2Flazier/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Nestednet%2Flazier/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Nestednet%2Flazier/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Nestednet","download_url":"https://codeload.github.com/Nestednet/lazier/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Nestednet%2Flazier/sbom","scorecard":{"id":100141,"data":{"date":"2025-08-11","repo":{"name":"github.com/Nestednet/lazier","commit":"376277b2cc66a4dee8b3a2e2a3278e13a32e7dbf"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":1.7,"checks":[{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"Code-Review","score":0,"reason":"Found 0/23 approved changesets -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Info: FSF or OSI recognized license: MIT License: LICENSE:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}},{"name":"SAST","score":0,"reason":"SAST tool is not run on all commits -- score normalized to 0","details":["Warn: 0 commits out of 2 are checked with a SAST tool"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"Vulnerabilities","score":0,"reason":"30 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-8w4h-3cm3-2pm2","Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw","Warn: Project is vulnerable to: GHSA-cwfw-4gq5-mrqx","Warn: Project is vulnerable to: GHSA-g95f-p29q-9xw4","Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg","Warn: Project is vulnerable to: GHSA-wxhq-pm8v-cw75","Warn: Project is vulnerable to: GHSA-2xv3-h762-ccxv","Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq","Warn: Project is vulnerable to: GHSA-qrmc-fj45-qfc2","Warn: Project is vulnerable to: GHSA-qqgx-2p2h-9c37","Warn: Project is vulnerable to: GHSA-6c8f-qphg-qjgp","Warn: Project is vulnerable to: GHSA-jf85-cpcp-j695","Warn: Project is vulnerable to: GHSA-fvqr-27wr-82fm","Warn: Project is vulnerable to: GHSA-4xc9-xhrj-v574","Warn: Project is vulnerable to: GHSA-x5rq-j2xg-h7qm","Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9","Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm","Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw","Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv","Warn: Project is vulnerable to: GHSA-hxm2-r34f-qmc5","Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3","Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m","Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h","Warn: Project is vulnerable to: GHSA-3mpr-hq3p-49h9","Warn: Project is vulnerable to: GHSA-fhjf-83wg-r2j9","Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9","Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw","Warn: Project is vulnerable to: GHSA-jv35-xqg7-f92r","Warn: Project is vulnerable to: GHSA-4g88-fppr-53pp","Warn: Project is vulnerable to: GHSA-4jqc-8m5r-9rpr"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-15T09:57:59.493Z","repository_id":127140634,"created_at":"2025-08-15T09:57:59.493Z","updated_at":"2025-08-15T09:57:59.493Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":274261916,"owners_count":25251958,"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-09-09T02:00:10.223Z","response_time":80,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","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":["images","javascript","javascript-library","lazy-loading","lazyload","lazyload-images"],"created_at":"2024-11-19T07:14:28.278Z","updated_at":"2025-09-09T07:49:01.511Z","avatar_url":"https://github.com/Nestednet.png","language":"JavaScript","readme":"[![Known Vulnerabilities](https://snyk.io/test/npm/lazier-js/badge.svg)](https://snyk.io/test/npm/lazier-js)\n## Lazier.js\nA little handy library for lazy loading the images of your Page:\n\n![](Example/record_example.gif)\n\nIt's inspired by the ideas that @JMPerez posted [here](https://medium.com/@jmperezperez/how-medium-does-progressive-image-loading-fd1e4dc1ee3d).\nIn order to work in all major browsers it avoids the CSS filters and uses the HTML5 canvas approach that Medium uses.\n\nIt uses a modified and lighter version of Mario Klingemann [SuperFastBlur](http://www.quasimondo.com/BoxBlurForCanvas) algorithm, modified in order to work with canvas objects and not unique id's.\n\n### What does Lazier.js?\nIn order to speed up the performance of your web page you can lazy load the images of it. That means to load the images when the DOM of your page is already loaded. Lazier.js does this for you!\n\nOh, and doing it the same way as Medium does it handles it pretty :sparkles: beautifully :sparkles: :wink:\n\n![](Example/stages.png)\n\n### How to use it\n\nGet both `lazier.min.js` and `lazier.min.css`.\nYou can download it from github or use npm to get the updated version.\n\n```BASH\nnpm install lazier-js\n```\n\nYou need to **link the minified css file** at the header of your page:\n```HTML\n\u003chead\u003e\n      \u003clink rel=\"stylesheet\" type=\"text/css\" href=\"lazier.min.css\"\u003e\n\u003c/head\u003e\n```\n**Modify the structure of your HTML file**:\nLazier.js uses the same HTML structure as [Medium](https://www.medium.com) you need to replace the images that you want to lazy load by the following block:\n```HTML\n\u003cdiv class=\"lazierContainer\"\u003e\n      \u003cimg class=\"lazierLowFy\" data-src=\"Test/test_mini_size.jpg\"\u003e\n      \u003ccanvas class=\"lazierCanvas\"\u003e\u003c/canvas\u003e\n      \u003cimg class=\"lazierRender\" data-src=\"Test/test2_mini_size.jpg\"\u003e\n      \u003cnoscript class=\"lazierFall\"\u003e\u0026lt;img class=\"lazierNoScript\" src=\"big.jpg\"\u0026gt;\u003c/noscript\u003e\n\u003c/div\u003e\n```\n**LowFi Image:**\n```HTML\n\u003cimg class=\"lazierLowFy\" data-src=\"mini.jpg\"\u003e\n```\nDefine as `data-src` the low fidelity image that you want to use. We have tested it with very small images, with a heavy compression: (25px widht, 20% quality).\n\n**HighFi Image:**\n```HTML\n\u003cimg class=\"lazierRender\" data-src=\"high.jpg\"\u003e\n```\nDefine as `data-src` the the high fidelity image that you want to load.\n\n**FallBack Image:**\n```HTML\n\u003cnoscript class=\"lazierFall\"\u003e\u0026lt;img class=\"lazierNoScript\" src=\"high.jpg\"\u0026gt;\u003c/noscript\u003e\n```\nDefine here the fallback image that is going to be loaded if the browser doesn't have JavaScript support. *(WIP)*\n\n**Load the minified JavaScript:**\n```HTML\n\u003cscript src=\"lazier.min.js\"\u003e\u003c/script\u003e\n```\nLoad the script at your Page and it's done! :star:\n\n**Example**\n```HTML\n\u003chead\u003e\n  \u003clink rel=\"stylesheet\" type=\"text/css\" href=\"lazier.min.css\"\u003e\n\u003c/head\u003e\n\u003cdiv style=\"width: 240px; height: 360px; display: inline-block;\"\u003e\n    \u003cdiv class=\"lazierContainer\"\u003e\n        \u003cimg class=\"lazierLowFy\" data-src=\"Test/test_mini_size.jpg\"\u003e\n        \u003ccanvas class=\"lazierCanvas\" id='lc'\u003e\u003c/canvas\u003e\n        \u003cimg class=\"lazierRender\" data-src=\"Test/test_medium_size.jpg\"\u003e\n        \u003cnoscript class=\"lazierFall\"\u003e\u0026lt;img class=\"lazierNoScript\" src=\"Test/test_medium_size.jpg\"\u0026gt;\u003c/noscript\u003e\n    \u003c/div\u003e\n\u003c/div\u003e\n\n\u003cdiv style=\"width: 240px; height: 360px; display: inline-block;\"\u003e\n    \u003cdiv class=\"lazierContainer\"\u003e\n        \u003cimg class=\"lazierLowFy\" data-src=\"Test/test2_mini_size.jpg\"\u003e\n        \u003ccanvas class=\"lazierCanvas\" id='lc'\u003e\u003c/canvas\u003e\n        \u003cimg class=\"lazierRender\" data-src=\"Test/test2_medium_size.jpg\"\u003e\n        \u003cnoscript class=\"lazierFall\"\u003e\u0026lt;img class=\"lazierNoScript\" src=\"Test/test_medium_size.jpg\"\u0026gt;\u003c/noscript\u003e\n    \u003c/div\u003e\n\u003c/div\u003e\n\n\u003cdiv style=\"width: 240px; height: 360px; display: inline-block;\"\u003e\n    \u003cdiv class=\"lazierContainer\"\u003e\n        \u003cimg class=\"lazierLowFy\" data-src=\"Test/test3_mini_size.jpg\"\u003e\n        \u003ccanvas class=\"lazierCanvas\" id='lc'\u003e\u003c/canvas\u003e\n        \u003cimg class=\"lazierRender\" data-src=\"Test/test3_medium_size.jpg\"\u003e\n        \u003cnoscript class=\"lazierFall\"\u003e\u0026lt;img class=\"lazierNoScript\" src=\"Test/test_medium_size.jpg\"\u0026gt;\u003c/noscript\u003e\n    \u003c/div\u003e\n\u003c/div\u003e\n\n\u003cdiv style=\"width: 240px; height: 360px; display: inline-block;\"\u003e\n    \u003cdiv class=\"lazierContainer\"\u003e\n        \u003cimg class=\"lazierLowFy\" data-src=\"Test/test4_mini_size.jpg\"\u003e\n        \u003ccanvas class=\"lazierCanvas\"\u003e\u003c/canvas\u003e\n        \u003cimg class=\"lazierRender\" data-src=\"Test/test4_medium_size.jpg\"\u003e\n        \u003cnoscript class=\"lazierFall\"\u003e\u0026lt;img class=\"lazierNoScript\" src=\"Test/test_medium_size.jpg\"\u0026gt;\u003c/noscript\u003e\n    \u003c/div\u003e\n\u003c/div\u003e\n\n\u003cscript src=\"lazier.min.js\"\u003e\u003c/script\u003e\n```\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnestednet%2Flazier","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnestednet%2Flazier","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnestednet%2Flazier/lists"}