𝗔𝘀𝘁𝗿𝗼 𝗚𝗮𝘃𝗲 𝗠𝘆 𝗦𝗶𝘁𝗲 𝗮 𝗣𝗲𝗿𝗳𝗲𝗰𝘁 𝗣𝗮𝗴𝗲𝗦𝗽𝗲𝗲𝗱 𝗦𝗰𝗼𝗿𝗲

Astro ನನ್ನ ಸೈಟ್‌ಗೆ ಪರಿಪೂರ್ಣ PageSpeed ಸ್ಕೋರ್ ನೀಡಿತು

ಮೊದಲು ನಾನು Astro ಬಗ್ಗೆ ಅನುಮಾನ ಹೊಂದಿದ್ದೆ. ನಾನು React ಮತ್ತು Next.js ಬಳಸುತ್ತಿದ್ದೆ. ನಂತರ ನಾನು Zimnovate ಸೈಟ್ ಅನ್ನು ನಿರ್ಮಿಸಿದೆ. Google PageSpeed ಅದಕ್ಕೆ ಪರಿಪೂರ್ಣ ಸ್ಕೋರ್ ನೀಡಿತು.

Astro ಡಿಫಾಲ್ಟ್ ಆಗಿ ಯಾವುದೇ JavaScript ಅನ್ನು ಕಳುಹಿಸುವುದಿಲ್ಲ. ಹೆಚ್ಚಿನ ಫ್ರೇಮ್‌ವರ್ಕ್‌ಗಳು ಸ್ಟ್ಯಾಟಿಕ್ ಕಂಟೆಂಟ್‌ಗಾಗಿ ಬ್ರೌಸರ್ ಅನ್ನು ಕೋಡ್ ರನ್ ಮಾಡಲು ಒತ್ತಾಯಿಸುತ್ತವೆ. Astro ಬಿಲ್ಡ್ ಸಮಯದಲ್ಲಿ ಘಟಕಗಳನ್ನು (components) HTML ಗೆ ರেন্ডರ್ ಮಾಡುತ್ತದೆ.

ಇದು Islands Architecture ಅನ್ನು ಬಳಸುತ್ತದೆ. ನಿಮ್ಮ ಪೇಜ್ ಒಂದು ಸ್ಟ್ಯಾಟಿಕ್ ಸಾಗರವಿದ್ದಂತೆ. ಇಂಟರಾಕ್ಟಿವ್ ಭಾಗಗಳು ದ್ವೀಪಗಳಿದ್ದಂತೆ. ಸಾಗರವು ಸಾಮಾನ್ಯ HTML ಆಗಿದೆ. ಕೇವಲ ದ್ವೀಪಗಳು ಮಾತ್ರ JavaScript ಅನ್ನು ಬಳಸುತ್ತವೆ.

ಕೋಡ್ ಯಾವಾಗ ಲೋಡ್ ಆಗಬೇಕು ಎಂಬುದನ್ನು ನೀವು ನಿಯಂತ್ರಿಸಬಹುದು:

• client:visible ಬಳಕೆದಾರರು ಸ್ಕ್ರೋಲ್ ಮಾಡಿದಾಗ ಲೋಡ್ ಆಗುತ್ತದೆ.
• client:load ತಕ್ಷಣವೇ ಲೋಡ್ ಆಗುತ್ತದೆ.
• client:idle ಬ್ರೌಸರ್ ಬಿಡುವಾಗ ಲೋಡ್ ಆಗುತ್ತದೆ.

ನಾನು Astro 4.x, Tailwind CSS ಮತ್ತು Supabase ಬಳಸಿದೆ. Supabase ಬ್ಲಾಗ್ ಪೋಸ್ಟ್‌ಗಳನ್ನು ಸಂಗ್ರಹಿಸುತ್ತದೆ. Astro ಬಿಲ್ಡ್ ಸಮಯದಲ್ಲಿ ಈ ಡೇಟಾವನ್ನು ಪಡೆದುಕೊಳ್ಳುತ್ತದೆ. ಬಳಕೆದಾರರಿಗೆ ಕ್ಯಾಶ್ ಮಾಡಲಾದ (cached) HTML ಸಿಗುತ್ತದೆ. ಇದು ತಕ್ಷಣವೇ ನಡೆಯುತ್ತದೆ.

ಇದು SEO ಗೆ ಸಹಾಯ ಮಾಡುತ್ತದೆ. ಸರ್ಚ್ ಬಾಟ್‌ಗಳು ತಕ್ಷಣವೇ HTML ಅನ್ನು ನೋಡುತ್ತವೆ. ಅವು JavaScript ಗಾಗಿ ಕಾಯುವುದಿಲ್ಲ.

ನೀವು ಒಂದೇ ಪ್ರಾಜೆಕ್ಟ್‌ನಲ್ಲಿ React, Vue ಅಥವಾ Svelte ಬಳಸಬಹುದು. ನಿಮ್ಮ ಕೌಶಲ್ಯಗಳನ್ನು ಉಳಿಸಿಕೊಳ್ಳಬಹುದು ಮತ್ತು ಉತ್ತಮ ವೇಗವನ್ನು ಪಡೆಯಬಹುದು.

ಈ ಕೆಳಗಿನವುಗಳಿಗಾಗಿ Astro ಬಳಸಿ:

• Agency ಸೈಟ್‌ಗಳು
• Landing pages
• CMS ಬ್ಲಾಗ್‌ಗಳು
• Portfolios

ಈ ಕೆಳಗಿನವುಗಳಿಗಾಗಿ Astro ಅನ್ನು ತಪ್ಪಿಸಿ:

• Dashboards
• Real-time apps

ವೆಬ್ ಈಗ ತುಂಬಾ ಭಾರವಾಗಿದೆ (bloated). Astro ಇದನ್ನು ಸರಿಪಡಿಸುತ್ತದೆ. ಇದು ಕಾರ್ಯಕ್ಷಮತೆಗೆ (performance) ಮೊದಲ ಆದ್ಯತೆ ನೀಡುತ್ತದೆ.

Source: https://dev.to/vincent_mugondora_599ed60/i-built-the-zimnovate-agency-site-with-astro-and-google-pagespeed-gave-it-a-perfect-score-heres-4img

Optional learning community: https://t.me/GyaanSetuAi