Sobes.tech
Middle

Чӣ гуна метавонем ба браузер кӯмак кунем, ки барои бор кардани захираҳо омода шавад?

sobes.tech AI

Ҷавоб аз AI

Истифодаи дастурҳои пешакӣ боргирӣ: preconnect, dns-prefetch, preload, prefetch, prerender.

Дастур Тавсиф Мисол
preconnect Муносибати пайвастшавӣ (DNS lookup, TCP handshake, TLS negotiation) бо дигар манбаи маълумотро дар пеш. <link rel="preconnect" href="https://cdn.example.com">
dns-prefetch Ҳалли номи домейнро дар пеш иҷро мекунад. <link rel="dns-prefetch" href="//api.example.com">
preload Манбаъ (JS, CSS, font) дар пеш бо афзалияти баланд талаб мекунад, ки render-ро монеъ намекунад. <link rel="preload" href="/styles.css" as="style">
prefetch Манбаъро талаб мекунад, ки эҳтимолан дар оянда зарур мешавад (масалан, дар саҳифаи оянда). <link rel="prefetch" href="/next_page.html">
prerender Саҳифаи ояндаро дар таби пинҳон пешакӣ render мекунад. <link rel="prerender" href="/upcoming_page.html">

Атрибут async ё defer-ро барои <script> истифода баред барои боргирии асинхронӣ ва иҷрои скриптҳо, бе монеъ шудан ба парсингии HTML:

<script src="script.js" async></script>
<script src="another-script.js" defer></script>

Атрибут loading="lazy"-ро барои тасвирҳо ва <iframe>-ҳо барои боргирии таъхирӣ истифода баред, вақте ки онҳо ба минтақаи назаррас дохил мешаванд:

<img src="image.jpg" loading="lazy" alt="Lazy loaded image">

Тавсия медиҳем, ки тасвирҳоро (тамом кардан, истифодаи форматҳои муосир WebP), font-ҳоро (қисмҳо, форматҳо WOFF/WOFF2) ва дигар манбаъҳоро оптимизатсия кунед.

CSS, JavaScript ва HTML-ро минификатсия ва кумпессия кунед.

Барои кеши кардани манбаъҳо ва таъмин намудани дастрасии офлайн истифода баред Service Worker.

Код JavaScript-и калонро ба қисмҳои хурд тақсим кунед (code splitting) ва онҳоро ба талабот боргирӣ кунед.

Барои беҳтар истифодаи HTTP/2 ва HTTP/3 барои мультиплексинг ва кумпессияи сарлавҳаҳо истифода баред.

Тавсия медиҳем, ки сарлавҳаҳои дуруст барои кеши (Cache-Control, Expires) дар сервер танзим карда шаванд.

Барои пешакӣ боргирии модулҳои JavaScript ES, <link rel="modulepreload">-ро истифода баред.

<link rel="modulepreload" href="/dist/module.js">