𝗔𝘀𝘁𝗿𝗼 ਨੇ ਮੇਰੀ ਸਾਈਟ ਨੂੰ ਇੱਕ ਪਰਫੈਕਟ PageSpeed ਸਕੋਰ ਦਿੱਤਾ
ਸ਼ੁਰੂ ਵਿੱਚ ਮੈਨੂੰ Astro 'ਤੇ ਸ਼ੱਕ ਸੀ। ਮੈਂ React ਅਤੇ Next.js ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਸੀ। ਫਿਰ ਮੈਂ Zimnovate ਸਾਈਟ ਬਣਾਈ। Google PageSpeed ਨੇ ਇਸਨੂੰ ਇੱਕ ਪਰਫੈਕਟ ਸਕੋਰ ਦਿੱਤਾ।
Astro ਡਿਫੌਲਟ ਰੂਪ ਵਿੱਚ ਜ਼ੀਰੋ JavaScript ਭੇਜਦਾ ਹੈ। ਜ਼ਿਆਦਾਤਰ ਫਰੇਮਵਰਕ ਸਟੈਟਿਕ ਕੰਟੈਂਟ ਲਈ ਬ੍ਰਾਊਜ਼ਰ ਨੂੰ ਕੋਡ ਚਲਾਉਣ ਲਈ ਮਜਬੂਰ ਕਰਦੇ ਹਨ। Astro ਬਿਲਡ ਟਾਈਮ ਵੇਲੇ ਕੰਪੋਨੈਂਟਸ ਨੂੰ HTML ਵਿੱਚ ਰੈਂਡਰ ਕਰਦਾ ਹੈ।
ਇਹ Islands Architecture ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹੈ। ਤੁਹਾਡਾ ਪੇਜ ਇੱਕ ਸਟੈਟਿਕ ਸਮੁੰਦਰ ਹੈ। ਇੰਟਰਐਕਟਿਵ ਹਿੱਸੇ ਟਾਪੂ (islands) ਹਨ। ਸਮੁੰਦਰ ਸਾਦਾ HTML ਹੈ। ਸਿਰਫ਼ ਟਾਪੂ ਹੀ JavaScript ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹਨ।
ਤੁਸੀਂ ਕੰਟਰੋਲ ਕਰਦੇ ਹੋ ਕਿ ਕੋਡ ਕਦੋਂ ਲੋਡ ਹੋਣਾ ਹੈ:
client:visibleਉਦੋਂ ਲੋਡ ਹੁੰਦਾ ਹੈ ਜਦੋਂ ਯੂਜ਼ਰ ਸਕ੍ਰੋਲ ਕਰਦਾ ਹੈ।client:loadਤੁਰੰਤ ਲੋਡ ਹੁੰਦਾ ਹੈ।client:idleਉਦੋਂ ਲੋਡ ਹੁੰਦਾ ਹੈ ਜਦੋਂ ਬ੍ਰਾਊਜ਼ਰ ਵਿਹਲਾ ਹੁੰਦਾ ਹੈ।
ਮੈਂ Astro 4.x, Tailwind CSS, ਅਤੇ Supabase ਦੀ ਵਰਤੋਂ ਕੀਤੀ। Supabase ਬਲੌਗ ਪੋਸਟਾਂ ਨੂੰ ਸਟੋਰ ਕਰਦਾ ਹੈ। Astro ਬਿਲਡ ਦੌਰਾਨ ਇਸ ਡੇਟਾ ਨੂੰ ਫੈਚ ਕਰਦਾ ਹੈ। ਯੂਜ਼ਰਾਂ ਨੂੰ ਕੈਸ਼ਡ HTML ਮਿਲਦਾ ਹੈ। ਇਹ ਤੁਰੰਤ ਹੁੰਦਾ ਹੈ।
ਇਹ SEO ਵਿੱਚ ਮਦਦ ਕਰਦਾ ਹੈ। ਸਰਚ ਬੋਟਸ ਤੁਰੰਤ HTML ਦੇਖਦੇ ਹਨ। ਉਹ JavaScript ਦੀ ਉਡੀਕ ਨਹੀਂ ਕਰਦੇ।
ਤੁਸੀਂ ਇੱਕ ਪ੍ਰੋਜੈਕਟ ਵਿੱਚ React, Vue, ਜਾਂ Svelte ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ। ਤੁਸੀਂ ਆਪਣੀ ਸਕਿੱਲ ਬਰਕਰਾਰ ਰੱਖਦੇ ਹੋ। ਤੁਹਾਨੂੰ ਬਿਹਤਰ ਸਪੀਡ ਮਿਲਦੀ ਹੈ।
Astro ਦੀ ਵਰਤੋਂ ਕਰੋ:
- Agency sites ਲਈ
- Landing pages ਲਈ
- CMS blogs ਲਈ
- Portfolios ਲਈ
ਇਹਨਾਂ ਲਈ Astro ਤੋਂ ਬਚੋ:
- Dashboards ਲਈ
- Real-time apps ਲਈ
ਵੈੱਬ ਬਹੁਤ ਭਾਰੀ (bloated) ਹੋ ਗਿਆ ਹੈ। Astro ਇਸ ਨੂੰ ਠੀਕ ਕਰਦਾ ਹੈ। ਇਹ ਪਰਫਾਰਮੈਂਸ ਨੂੰ ਪਹਿਲ ਦਿੰਦਾ ਹੈ।
Optional learning community: https://t.me/GyaanSetuAi