كيف انتقل استوديو هارون من وردبرس إلى أسترو

ما زلت أتذكر أنه قبل بضع سنوات، عندما بدأت Harun Studio، كان WordPress هو الخيار الأكثر منطقية. كنت أستخدم WordPress منذ عام 2015 ولم أفكر أبدًا في تعلم مكدس آخر مثل Astro.

لكن الذكاء الاصطناعي غيّر كل شيء. تستمر تكنولوجيا الويب في التحرك، ومع التقدم السريع للذكاء الاصطناعي ومولدات المواقع الثابتة، بدأت أسأل نفسي: هل لا يزال WordPress هو الخيار الأفضل لهذا الموقع؟

بعد تقييم أعمق، قررت الانتقال من WordPress إلى Astro.js واستضافة الموقع على صفحات Cloudflare. النتيجة؟ أداء أفضل، وسير عمل أكثر كفاءة، وتكلفة أقل.

اسمحوا لي أن أتجول في تلك الرحلة بمزيد من التفاصيل.

نقطة البداية: استوديو هارون على ووردبريس

قبل الترحيل، كان موقع Harun Studio الإلكتروني يعمل بشكل جيد بالفعل. بصراحة، لم أواجه أية مشكلات كبيرة مع WordPress. حتى أنني تمكنت من الوصول إلى درجة 100 في جميع مقاييس PageSpeed ​​Insights: الأداء، وإمكانية الوصول، وأفضل الممارسات، وتحسين محركات البحث.

كان هذا هو مكدس WordPress الذي استخدمته:

• الموضوع: GeneratePress Premium
• منشئ الصفحة: GenerateBlocks Pro
• SEO: Slim SEO
• النماذج: نموذج الاتصال 7
• البريد الإلكتروني: بت SMTP
• الأمان: NinjaFirewall
• الأداء: Nginx-Cache، الصفحات الطائرة
• المرافق: Debloat، Fluent Snippet، Flamingo

على الرغم من أن أداء الموقع كان جيدًا بالفعل، إلا أنني مازلت أرى المجالات التي يمكن تحسينها:

1. الصيانة المعقدة: تحتاج السمات والمكونات الإضافية ونواة WordPress إلى تحديثات منتظمة.
2. تكاليف الاشتراك الإضافية: أضافت اشتراكات السمة المميزة والمكونات الإضافية اعتبارات الصيانة المتكررة.
3. الاستضافة: ما زلت بحاجة إلى VPS للحصول على أفضل أداء، مما أضاف تبعية تشغيلية أخرى.
4. سير العمل: يعد WordPress سهل الاستخدام، ولكن لا يزال من الممكن أن تكون تحديثات المحتوى أكثر كفاءة باستخدام نهج أكثر حداثة.

لماذا Astro.js؟

عندما بدأت أفكر في الترحيل، كانت هناك بضعة أطر عمل حديثة على رادارتي، بما في ذلك Next.js. لكن استرو برز لعدة أسباب:

1. التركيز على المحتوى أولاً: تم تصميم Astro جيدًا بشكل خاص لمواقع الويب ذات المحتوى الثقيل مثل Harun Studio.
2. الترطيب الجزئي: يقوم Astro بشحن JavaScript المطلوبة بالفعل فقط.
3. دعم متعدد الأطر: يظل مرنًا إذا كنت بحاجة إلى React أو Vue أو Svelte أو أي شيء آخر.
4. أداء ممتاز: يؤدي إنشاء الموقع الثابت بشكل افتراضي إلى إنتاج HTML سريع جدًا.
5. التوجيه المستند إلى الملف: بسيط وسهل الفهم.
6. دعم Markdown/MDX الأصلي: مثالي لسير عمل المحتوى.
7. مجتمع ونظام بيئي سريع النمو.
8. سير العمل المعتمد على الذكاء الاصطناعي: بصفته مطورًا يستخدم الذكاء الاصطناعي بالفعل في العمل اليومي، فإن Astro يناسب سير العمل الفوري بشكل أفضل. أصبحت صياغة المقالات والتحرير واستكشاف التصميم وإنشاء ميزات جديدة أسهل بدون الكتابة اليدوية لـ CSS أو PHP أو JavaScript بطريقة WordPress القديمة باستمرار.

لماذا صفحات Cloudflare؟

إلى جانب صفحات Cloudflare، فكرت أيضًا في Vercel وNetlify. لكن صفحات Cloudflare أصبحت الخيار النهائي للأسباب التالية:

1. إعداد عملي للمنصة: كانت إمكانيات المنصة المتاحة كافية لحالة الاستخدام الخاصة بي.
2. تكامل DNS والوكيل: يعمل بشكل جيد مع خدمات Cloudflare الأخرى التي أستخدمها بالفعل.
3. قواعد Cloudflare: من السهل إدارة عمليات إعادة التوجيه ومعالجة الطلبات.
4. التواجد في إندونيسيا: تتمتع Cloudflare بحضور مميز بالقرب من جمهوري، مما يساعد على سرعة الزوار المحليين.
5. التوافق: لا توصي Vercel وNetlify بوضع Cloudflare أمامهما، بينما كنت أرغب في الاستمرار في استخدام خدمات Cloudflare.
6. وقت تشغيل موثوق: من الصعب الجدال حول وقت تشغيل Cloudflare، وهو أمر مهم لمصداقية الأعمال.

عملية الهجرة

تخطيط هيكل المحتوى

أولاً، قمت بتعيين بنية موقع الويب مرة أخرى لتحسين الوضوح:

• الصفحة الرئيسية: تظل الصفحة الرئيسية الرئيسية
• الصفحات: حول، الاتصال، والمصطلحات
• المدونة: جميع المقالات داخل /blog/
• الخدمات: تستخدم جميع صفحات الخدمة البادئة /jasa/

لقد قمت بتغيير بعض عناوين URL مع وضع تحسين محركات البحث (SEO) في الاعتبار. على سبيل المثال، أصبحت عناوين URL مثل https://harunstudio.com/jasa-perbaikan-website هي https://harunstudio.com/jasa/perbaikan-website. لتجنب الروابط المعطلة، استخدمت قواعد Cloudflare لعمليات إعادة التوجيه.

الإطار والأدوات

لتسريع عملية الترحيل استخدمت:

1. موضوع Astro: لقد بدأت مع Astroship، على الرغم من أنني وجدت لاحقًا AstroWind أكثر اكتمالاً. يتضمن AstroWind بالفعل العلامات والفئات وتبديل اللون الداكن/الفاتح وخدمة RSS.
2. تصدير WordPress: استخدمت WordPress Export to Markdown لتحويل محتوى WordPress إلى Markdown.
3. التعامل مع النماذج: كان Web3Forms كافيًا للتعامل مع نماذج الاتصال مع 250 إرسالًا شهريًا.
4. تكامل تحسين محركات البحث: ساعد Astro SEO في Open Graph وبطاقات Twitter والعلامات الوصفية.
5. مساعدة الذكاء الاصطناعي: لعب Cursor AI مع Claude Sonnet 3.7 دورًا كبيرًا في عملية التطوير.

إعادة التصميم والتطوير

ظل مفهوم التصميم العام قريبًا من موقع WordPress القديم، ولكن باستخدام Cursor AI وClaude 3.7، قمت بإعادة تصميم عدة أقسام عبر الموقع. وتبين أن العملية كانت أسرع بكثير مما كنت أتوقع. أنتج الذكاء الاصطناعي أكثر من 90% من التعليمات البرمجية التي كنت بحاجة إليها.

كما أصبح سير عمل التطوير أكثر بساطة. لقد عملت محليًا على تنظيم التغييرات وتنفيذها على GitHub، والتقطتها صفحات Cloudflare تلقائيًا وأعادت بناء الموقع. أدى سير العمل هذا إلى تقليل الأخطاء لأنه كان بإمكاني الاختبار محليًا قبل بدء البث المباشر.

أحد الأدلة المباشرة على مدى فائدة الذكاء الاصطناعي في سير العمل هو دراسة الحالة التي تقرأها الآن. تمت كتابته بنسبة 100٪ بواسطة الذكاء الاصطناعي باستخدام كلود سونيت 3.7. لقد قدمت فقط السياق والحقائق ذات الصلة.

بعض التحديات التي واجهتني:

1. تعلم بناء جملة Astro، وهو قريب من HTML ولكن لا يزال لديه أنماطه الخاصة.
2. التحول من تفكير WordPress إلى التفكير القائم على المكونات.
3. تكييف منطق النموذج الأكثر تعقيدًا في Web3Forms.

لمساعدة Cursor في إنتاج تعليمات برمجية أكثر دقة، قمت بتضمين وثائق Astro وTailwind في مطالباتي، مما أدى إلى تحسين العملية كثيرًا.

النتائج والتحليل

مكاسب كبيرة في الأداء

كان الاختلاف قبل الهجرة وبعدها واضحًا جدًا. باستخدام الصفحة الرئيسية لاستوديو هارون كمثال:

قبل (وردبرس):

• 37 طلبًا
• تم نقل 2.15 ميجابايت / 1.59 ميجابايت
• التشطيب: 4.96 ثانية

بعد (ASTRO):

• 17 طلبًا
• تم نقل 527.91 كيلوبايت / 255.22 كيلوبايت
• التشطيب: 0.626 ثانية

وهذا يعني:

• طلبات HTTP أقل بنسبة 54%
• حجم نقل أقل بنسبة 75%
• 8 أضعاف وقت تحميل الصفحة الأسرع

التكلفة وكفاءة الصيانة

1. انتقلت الاستضافة من إعداد يعتمد على الخادم إلى نموذج Cloudflare Pages أخف.
2. لا مزيد من اشتراكات القالب أو المكون الإضافي المميز.
3. صيانة أبسط: لا مزيد من التحديثات الروتينية الأساسية والإضافية والموضوعية.
4. أمان أفضل افتراضيًا: مواقع الويب الثابتة أكثر أمانًا بشكل طبيعي لأنه لا توجد قاعدة بيانات مباشرة أو سطح خلفي تقليدي للهجوم.

جدول المقارنة

متري	ووردبريس	استرو	التغيير
طلبات HTTP	37	17	-54%
حجم النقل	2.15 ميجا بايت	527.91 كيلو بايت	-75%
وقت التحميل	4.96 ث	0.626 ث	8x أسرع
صيانة	مجمع	الحد الأدنى	أبسط
نموذج الاستضافة	الإعداد المعتمد على VPS	صفحات كلاود فلير	مبسطة
الموضوع/نموذج البرنامج المساعد	سمة مميزة ومكونات إضافية	مكونات وتكاملات استرو	عدد أقل من التبعيات المتكررة

إنتاجية أفضل

باستخدام أدوات الذكاء الاصطناعي مثل Cursor وClaude 3.7، أصبحت تحديثات التطوير والمحتوى أكثر كفاءة:

1. كتابة المدونة: يساعد الذكاء الاصطناعي في الكتابة والتنسيق.
2. التصميم والتطوير: يمكن تنفيذ تغييرات واجهة المستخدم وتجربة المستخدم بشكل أسرع بكثير.
3. تصحيح الأخطاء: يساعد الذكاء الاصطناعي في تحديد المشكلات وحلها بسرعة.
4. النشر السلس: تجعل GitHub + Cloudflare Pages عملية النشر بسيطة ويمكن التحكم فيها.

أصبح سير العمل أكثر كفاءة لأن Cursor + Claude Sonnet 3.7 أصبح الآن موثوقًا به حقًا. من الناحية العملية، يمكنني التركيز على التوجيه ومراقبة الجودة وقرارات التصميم، في حين يتم تفويض الكثير من العمل الفني المتكرر إلى الذكاء الاصطناعي. بالنسبة للمحتوى، يمكنني إعداد المسودة والسياق، ثم استخدام الذكاء الاصطناعي للتحرير ووضع اللمسات النهائية. بالنسبة للتصميم والميزات، يمكنني تقديم مطالبة واضحة وتكرارها حتى تبدو النتيجة صحيحة.

Astro vs WordPress: متى يجب عليك اختيار أيهما؟

لأكون صادقًا، لا أوصي بـ Astro للجميع. لا يشعر الجميع بالارتياح تجاه التعليمات البرمجية أو أدوات الذكاء الاصطناعي مثل Cursor وWindsurf.

لا يزال WordPress هو الخيار الأفضل إذا:

• تريد إدارة المحتوى وتحريره بشكل أسهل
• لا يمتلك فريقك الخلفية التقنية لإدارة موقع قائم على التعليمات البرمجية
• تحتاج إلى تغيير المحتوى بشكل متكرر وتريد القيام بذلك بنفسك

يكون Astro مناسبًا بشكل أفضل عندما:

• أنت جاد بشأن عملك ولا تريد قضاء الكثير من الوقت في صيانة موقع الويب
• لقد اعتدت بالفعل على تفويض أعمال التطوير إلى أحد المطورين
• تريد تكلفة صيانة أقل على المدى الطويل
• تريد توفير تكلفة الاستضافة لأن الأنظمة الأساسية مثل Cloudflare Pages وVercel هي بالفعل أكثر من كافية لمواقع الويب الثابتة

تجدر الإشارة أيضًا إلى أن WordPress لا يزال بإمكانه تحقيق أداء قوي واجتياز Core Web Vitals، طالما أن المكدس خفيف الوزن، على سبيل المثال GeneratePress مع GenerateBlocks.

ما يأتي بعد ذلك

بعد الترحيل، أصبحت بعض الخطوات التالية واضحة بالفعل لـ Harun Studio:

1. نمو المدونة: المزيد من دراسات الحالة والبرامج التعليمية.
2. دعم i18n: دعم متعدد اللغات.
3. مراقبة مؤشرات الويب الحيوية: مراقبة مستمرة لمؤشرات الويب الأساسية.
4. الاستكشاف التقدمي لتطبيقات الويب.

خاتمة

تبين أن الانتقال من WordPress إلى Astro.js هو الخطوة الصحيحة لـ Harun Studio. بفضل الأداء الأفضل والتكلفة الأقل وسير العمل الأكثر كفاءة، أصبح موقع الويب الآن في وضع أقوى لدعم الأعمال بمرور الوقت.

إذا كنت تفكر في عملية ترحيل مماثلة، فإن Astro.js يستحق الاهتمام الجاد، خاصة إذا كان موقع الويب الخاص بك يركز على المحتوى. باستخدام أدوات الذكاء الاصطناعي الحديثة مثل Cursor وClaude، يمكن أن تتحرك كل من الهجرة والتطوير المستقبلي بشكل أسرع بكثير.

يوفر Harun Studio أيضًا خدمة ترحيل WordPress إلى Astro إذا كنت تريد فوائد المكدس الحديث دون المرور بمنحنى التعلم بنفسك.

الموارد والأدوات المستخدمة

• التوثيق الفلكي
• قالب AstroWind
• تصدير ووردبريس إلى Markdown
• وثائق Web3Forms
• المؤشر AI (رابط الإحالة)
• دليل الهجرة لباتريك ثورموند

هل تفكر في نقل موقع الويب الخاص بك من WordPress إلى مجموعة أكثر حداثة مثل Astro؟ أو هل لديك أسئلة حول عملية الهجرة؟ لا تتردد في اتصل بنا ويمكننا مناقشة الأمر بشكل أكبر.