this if u try indie comiled.js problem will not solved but ur performance can improve
Reduce unused JavaScript
0.45s
Reduce unused JavaScript and defer loading scripts until they are required to decrease bytes consumed by network activity. Learn how to reduce unused JavaScript.LCP
URL | Transfer Size | Potential Savings |
|---|---|---|
Blogger Hosting 1st Party | 46.9 KiB | 27.2 KiB |
…res/293…-indie_compiled.js (resources.blogblog.com) | 46.9 KiB | 27.2 KiB |
Example of async attribute: imrpoved 93
paste this code just below <body> you have to paste only one code async or defer
<script async src="your-script.js"></script>
<script async src="https://resources.blogblog.com/blogblog/data/res/2933384995-indie_compiled.js"></script>
Example of defer attribute: improved 96
<script defer src="your-script.js"></script>
<script defer src="https://resources.blogblog.com/blogblog/data/res/2933384995-indie_compiled.js"></script>
1. Media Queries:
paste this in head section
ye pura head code ke sath and closing tag ke sath dalna hoga
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Your Page Title</title>
<link href='styles-desktop.css' media='(min-width: 768px)' rel='stylesheet'/>
<link href='styles-mobile.css' media='(max-width: 767px)' rel='stylesheet'/>
</head>
<body>
<!-- Your webpage content -->
<!-- A placeholder div for lazy loading -->
<div id="myLazyLoadElement" style="height: 1000px;"></div>
<!-- IntersectionObserver lazy loading script -->
<script>
// JavaScript code for lazy loading
</script>
</body>
</html>
2. Lazy Loading Background Images:
paste this code 👇just below the <script>
const targets = document.querySelectorAll('.lazy-load-bg');
const lazyLoad = (target) => {
const io = new IntersectionObserver((entries, observer) => {
entries.forEach((entry) => {
if (entry.isIntersecting) {
const img = entry.target;
const imgUrl = img.getAttribute('data-src');
img.style.backgroundImage = `url(${imgUrl})`;
observer.disconnect();
}
});
});
io.observe(target);
};
targets.forEach(lazyLoad);
And paste this👇 code in your HTML: layout
<div class="mspin-black-large lazy-load-bg" data-src="https://www.blogblog.com/indie/mspin_black_large.svg">
<!-- Other content -->
</div>
Comments
Post a Comment