لماذا أسترو؟

أسترو هو إطار عمل ويب شامل لبناء مواقع ويب سريعة تركز على المحتوى.

لماذا أختار أسترو بدل أطر الويب الأخرى؟ إليك خمسة مبادئ تصميم أساسية تساعد في شرح سبب بناء أسترو، والمشكلات التي تم إنشاؤه لحلها، ولماذا قد يكون أسترو أفضل خيار لمشروعك أو فريقك.

لأن أسترو…

قسم بعنوان لأن أسترو…

1. موجه للمحتوى: صُمِم أسترو للمواقع الغنية بالمحتوى.
2. الخادم أولًا: تعمل المواقع أسرع حين يُصيّر الـ HTML على الخادم.
3. سريع افتراضيًا: يجب أن يكون من المستحيل إنشاء موقع ويب بطيء باستخدام أسترو.
4. سهل الاستخدام: لست بحاجة إلى أن تكون خبيرًا لاستخدام أسترو.
5. مليء بالمزايا، ولكن مرن: اكثر من 100+ إضافة لتختار منها.

موجه للمحتوى

قسم بعنوان موجه للمحتوى

صُمِم أسترو للمواقع كثيفة المحتوى. هذا يشمل معظم مواقع التسويق والنشر والتوثيق والمدونات والمواقع الشخصية، وحتى بعض مواقع التجارة الإلكترونية.

على النقيض من ذلك، تم تصميم معظم أطر الويب الحديثة لبناء تطبيقات الويب. تعمل هذه الأطر بشكل أفضل لبناء مشاريع - أكثر تعقيدا - تشبه التطبيقات في المتصفح، مثل: لوحات التحكم، صناديق البريد، وسائل التواصل، تطبيقات تنظيم المهام، وحتى مشاريع شبيهة بتطبيقات سطح المكتب، مثل Figma و Ping.

هذه أحد أهم الاختلافات التي يجب فهمها حول أسترو. يتيح تركيز أسترو الأساسي على مشاريع المحتوى الكثيف تقديم أداء مميز لا مثيل له، والذي لن يكون منطقيًا بالنسبة لأطر الويب التي لا تركز على المواقع الغنية بالمحتوى أن تؤدي مثله.

نصيحة

إذا كان مشروعك يصنف تحت النوع الثاني من الفقرة السابقة “تطبيق”، قد لا يكون أسترو هو الخيار الصحيح لمشروعك… وبالتأكيد هذه ليست مشكلة! تحقق من Next.js للحصول على بديل ملائم أكثر للتطبيقات.

الخادم أولًا

قسم بعنوان الخادم أولًا

يحاول أسترو تصيير الواجهات على الخادم بدلًا من المتصفح قدر الإمكان. وهذه الطريقة التي تعمل بها أطر الويب الكلاسيكية مثل: PHP و WordPress و Laravel و Ruby on Rails، …الخ، منذ عقود. لكنك بغير حاجة إلى تعلم لغة ثانية تستخدمها على الخادم لتفعل المِثل. مع أسترو، لا يزال كل شيء مجرد HTML و CSS و JavaScript (أو TypeScript، إذا تُحب).

تتناقض هذه الطريقة مع أطر عمل جافا سكربت الحديثة الأخرى مثل: Next.js و SvelteKit و Nuxt وRemix وغيرها. تتطلب هذه الأطر تصيير موقع الويب بالكامل على المتصفح، وأيضًا على الخادم لمعالجة مخاوف الأداء. أطلق على هذا النهج اسم تطبيق الصفحة الوحيدة (SPA)، على النقيض من نهج أسترو تطبيق الصفحات المتعددة (MPA).

نموذج SPA له فوائده. ومع ذلك، تأتي هذه الفوائد مع تعقيدات إضافية ومساومات للأداء. مما يضر بسرعة الصفحة -- انظر على سبيل المثال مقياس الوقت المستغرق للتفاعل (TTI) -- وهو أمر غير منطقي بالنسبة للمواقع التي تركز على المحتوى حيث تكون سرعة التحميل الأولية ضرورية.

سريع افتراضيًا

قسم بعنوان سريع افتراضيًا

الأداء السريع دائمًا مهم، ولكنه بالغ الأهمية لمواقع الويب التي تركز على المحتوى. لقد ثبت أنّ ضَعف الأداء يفقدك المشاركات، الزوار، والمال. على سبيل المثال:

• كل 100 مللي ثانية أسرع ← تحويلات أكثر بنسبة 1٪ (Mobify، تكسب +$380,000/سنويًا)
• 50٪ أسرع ← 12٪ مبيعات أكثر (AutoAnything)
• 20٪ أسرع ← تحويلات أكثر بنسبة 10٪ (Furniture Village)
• 40٪ أسرع ← 15٪ تسجيلات اشتراكات أكثر (Pinterest)
• 850 مللي ثانية أسرع ← 7٪ تحويلات أكثر (COOK)
• كل ثانية أبطأ ← 10٪ مستخدمين أقل (BBC)

في العديد من أطر الويب، من السهل إنشاء موقع ويب يبدو رائعًا أثناء التطوير، لكن بطيء بشكل غير مقبول عند رفعه. غالبًا ما تكون جافا سكريبت هي الجاني، لأن هواتف المستخدمين والأجهزة ذات الطاقة المنخفضة عامة نادرًا ما تقترب من سرعة حاسوب المُطوِّر.

يكمن سحر أسترو في كيفية الجمع بين الهدفين الموضحين أعلاه -- التركيز على المحتوى، مع تطبيق متعدد الصفحات على الخادم -- لتقديم مساومات ومزايا لا تستطيع الأطر الأخرى تقديمها. والنتيجة هي أداء مذهل لكل موقع ويب، بشكل أساسي، هدفنا: أن يكون أقرب من المستحيل إنشاء موقع ويب بطيء باستخدام أسترو.

يمكن لموقع مبني بأسترو الفتح 40٪ أسرع مع جافا سكريبت أقل بنسبة 90٪ من نفس الموقع الذي تم إنشاؤه باستخدام إطار الويب React الأكثر شعبية. لكن لا تسلّم بكلامنا دون تحقق: شاهد أداء أسترو يُذهل Ryan Carniato (منشئ أطر الويب Solid.js و Marko).

سهل الاستخدام

قسم بعنوان سهل الاستخدام

هدف أسترو هو أن يكون متاحًا لكل مطور ويب. صُمِم أسترو ليشعرك بأنه مألوف بغض النظر عن مستوى مهارتك أو خبراتك السابقة في تطوير الويب.

بدايةً تأكدنا من إمكانية استخدام أيًا من إطارات الواجهات التي تفضلها وتعرفها بالفعل. أسترو يدعم React و Preact و Svelte و Vue و Solid و Lit وغيرهم لإنشاء مكونات واجهة جديدة في مشروع أسترو.

أردنا أيضًا تضمين لغة رائعة لانشاء المكونات في أسترو. للقيام بذلك، أنشأنا لغة الواجهات .astro الخاصة بنا. والمشابهة بشدة لـ HTML، وبالتالي أي كود يعمل في HTML هو بالفعل مكون Astro صالح! ولكنه أيضًا يستعير بعض المميزات من لغات المكونات الأخرى مثل تعبيرات JSX في React وتحديد مجال التنسيقات (Style Scoping) في Svelte و Vue. يُسهِّل هذا القُرب من HTML أيضًا استخدام التحسين التدريجي (Progressive Enhancement) وأنماط إمكانية الوصول (Accessibility) الشائعة دون مجهود إضافي.

صُمِم أسترو ليكون أقل تعقيدًا من أطر الواجهات الأخرى. أهم الأسباب التي دفعتنا لذلك أن أسترو يعمل على الخادم لا المتصفح. وبالتالي لا تقلق بشأن بعض تعقيدات أطر العمل الأخرى مثل: الـ hooks و الـ stale closures في React، أو الـ refs في Vue، أو الـ observables في Svelte. لا يوجد تفاعل على الخادم، لذلك يذهب كل هذا التعقيد أدراج الرياح.

أحد أقوالنا المفضلة هو: نسمح بالتعقيد. صممنا أسترو لإزالة أكبر قدر ممكن من “التعقيدات المطلوبة” من تجربة المطور، خاصة عند الاستخدام لأول مرة. يمكنك إنشاء موقع ويب بسيط مثل “مرحبا بالعالم” في أسترو باستخدام HTML و CSS فقط. بعد ذلك، عندما تحتاج إلى بناء شيء أكثر تعقيدا وأكثر قوة، يمكنك استخدام بقية المميزات المضمنة تدريجيًا.

مليء بالمزايا، ولكن مرن

قسم بعنوان مليء بالمزايا، ولكن مرن

أسترو إطار ويب شامل يأتي مع كل ما تحتاجه لبناء موقع ويب. يوفر أسترو إمكانية بناء مكونات الويب، وتوجيهًا قائمًا على الملفات، ومعالجة الأصول (الخطوط والصور وغيرها)، وبناء الموقع وتحزيمه، والتحسينات، وجلب البيانات، والمزيد. يمكنك إنشاء مواقع ويب رائعة بالميزات الأساسية لأسترو دون الحاجة لشيء آخر.

إذا كنت بحاجة إلى مزيد من التحكم، يمكنك توسيع أسترو بـ أكثر من 100 اضافة مثل React، Svelte، Vue، Tailwind CSS، MDX، والمزيد. اربط بنظام إدارة المحتوى الذي تفضل أو انشر موقعك على مضيفك المفضل بأمر واحد فقط.

أسترو ليس إطار لواجهات الويب، مما يعني بإمكانك العمل على إطارك المفضل. React أو Preact أو Solid أو Svelte أو Vue أو Lit بشكل رسمي في أسترو. يمكنك حتى استخدام أكثر من إطار في نفس الصفحة، مما يجعل نقل المشاريع بين الأطر أمرًا سهلًا، ويمنع حكر مشروع على إطار بعينه.