دليل ترحيل WordPress إلى Astro: 7 خطوات لعام 2026
Astro هو أفضل بديل لـ WordPress للمواقع الثقيلة بالمحتوى في 2026
Astro هو أفضل بديل WordPress للمواقع الغنية بالمحتوى في 2026 -- المدونات والتوثيق والصفحات التسويقية -- لأنه يشحن صفر JavaScript افتراضياً ويتفوق على WordPress في Core Web Vitals بمقدار 60-80 نقطة. لقد قمت بترحيل عشرات مواقع WordPress إلى Astro على مدار السنتين الماضيتين، تتراوح من مدونات شخصية بـ 50 منشور إلى بوابات توثيق بـ 3000 صفحة، والنتائج متسقة بشكل دراماتيكي: أوقات تحميل أقل من الثانية، درجات Lighthouse فوق 95، وفواتير استضافة تنخفض من 99 دولار/شهر إلى صفر تماماً.
هذا ليس دليل "صدّر فقط XML وتمنى التوفيق". سأرشدك خلال العملية الدقيقة التي أستخدمها، بما في ذلك المشاكل التي ستلدغك إذا لم تخطط لها -- الروابط المكسورة والصور المفقودة وأكواد shortcodes اليتيمة وسؤال نظام التعليقات الذي يربك الجميع.
جدول المحتويات
- لماذا Astro بدلاً من WordPress
- Astro مقابل Next.js مقابل Gatsby للترحيل من WordPress
- دليل الترحيل بـ 7 خطوات
- تصدير بيانات WordPress إلى مجموعات محتوى Astro
- الحفاظ على SEO: إعادات التوجيه 301 والخريطة والبيانات المنظمة
- مقارنة تكاليف الاستضافة
- الأسئلة الشائعة
لماذا Astro بدلاً من WordPress
WordPress معقدة بشكل مفرط لمعظم مواقع المحتوى. أنت تقوم بتشغيل PHP و MySQL وخادم ويب وطبقة تخزين مؤقت وربما عشرات الإضافات فقط لخدمة ما هو في الأساس محتوى ثابت. كل تحميل صفحة يضرب قاعدة البيانات. كل إضافة هي ثغرة أمان محتملة. كل تحديث هو دعاء بعدم كسر أي شيء.
Astro تقلب هذا النموذج. تقوم بقبل عرض صفحاتك إلى HTML ثابت في وقت الإنشاء. لا قاعدة بيانات. لا وقت تشغيل من جانب الخادم. لا PHP. الناتج هو HTML و CSS عادية و -- فقط عندما تختار صراحةً -- JavaScript.
إليك ما أراه باستمرار عبر الترحيلات:
| المقياس | WordPress (مُدار) | Astro (ثابت) | التحسن |
|---|---|---|---|
| Lighthouse Performance | 34-55 | 95-100 | +60-80 نقطة |
| First Contentful Paint | 2.8-4.2s | 0.4-0.8s | ~80% أسرع |
| Total Blocking Time | 200-800ms | 0-10ms | ~98% تقليل |
| حجم الصفحة (منشور مدونة نموذجي) | 1.5-3.5 MB | 80-250 KB | ~90% أصغر |
| Time to Interactive | 4-8s | 0.5-1.0s | ~85% أسرع |
| طلبات HTTP | 60-130 | 8-15 | ~85% أقل |
هذه ليست مختارة بعناية. إنها متوسطات من ترحيلات حقيقية. مواقع WordPress مع إضافات التخزين المؤقت و CDN لا تزال لا يمكنها لمس بناء Astro الثابت لأنها تفعل بشكل أساسي عملاً أكثر لكل طلب.
زاوية الأمان
WordPress هو نظام إدارة المحتوى الأكثر مهاجمة على الإنترنت. ليس لأنه سيء، بل لأنه في كل مكان وله سطح هجوم ضخم -- تنفيذ PHP وقاعدة البيانات والملفات المرفوعة وـ XML-RPC ونقاط نهاية REST API وصفحات تسجيل الدخول للمسؤول. كل شهر يحمل ثغرات إضافية جديدة.
مواقع Astro المنشورة على CDN لديها سطح هجوم أساسياً صفر. لا يوجد خادم للاستغلال، لا لوحة إدارة لفرض الدخول، لا قاعدة بيانات للحقن فيها. موقعك هو مجلد من ملفات HTML الموجودة على شبكة حافة عالمية.
تجربة المطور
إذا حاولت من قبل تخصيص موضوع WordPress، فأنت تعرف الألم: علامات قوالب PHP ممزوجة بـ HTML، التسلسل الهرمي للقالب الذي يتطلب حفظاً، ملفات functions.php التي تنمو إلى وحوش غير قابلة للصيانة، تضارب الإضافات المستمرة.
يستخدم Astro عمارة قائمة على المكونات مع تنسيق ملف يبدو وكأنه HTML مع قوى خارقة. يمكنك استخدام مكونات React أو Vue أو Svelte أو Solid داخل صفحات Astro -- لكن فقط عندما تحتاج فعلاً إلى التفاعل. بالنسبة للمدونة أو موقع التسويق، ربما لن تحتاج.
---
// src/pages/blog/[...slug].astro
import { getCollection } from 'astro:content';
import BlogLayout from '../../layouts/BlogLayout.astro';
export async function getStaticPaths() {
const posts = await getCollection('blog');
return posts.map(post => ({
params: { slug: post.slug },
props: { post },
}));
}
const { post } = Astro.props;
const { Content } = await post.render();
---
<BlogLayout title={post.data.title} description={post.data.excerpt}>
<article>
<h1>{post.data.title}</h1>
<time datetime={post.data.date.toISOString()}>
{post.data.date.toLocaleDateString()}
</time>
<Content />
</article>
</BlogLayout>
تلك صفحة منشور مدونة ديناميكية كاملة. حاول فعل ذلك في WordPress بنفس الوضوح.
Astro مقابل Next.js مقابل Gatsby للترحيل من WordPress
Astro
تم بناء Astro خصيصاً لمواقع المحتوى. تعني "بنية الجزر" الخاصة بها أنك تشحن صفر JS ما لم تحتاج مكونة معينة إليه. توفر مجموعات المحتوى معالجة markdown آمنة للنوع مع التحقق من صحة المخطط المدمج. أوقات الإنشاء سريعة، والنموذج العقلي بسيط، ولا تحتاج إلى فهم React لاستخدامه. بالنسبة للمدونات والتوثيق وموقع التسويق، فهو الخيار الواضح في 2026. إذا كنت تستكشف هذا الطريق، فإن فريق تطوير Astro لدينا تعامل مع الترحيلات بكل حجم.
Next.js
Next.js هي إطار عمل تطبيق كامل. تتعامل مع المصادقة وتقديم الجانب من الخادم وطرق API والبرمجيات الوسيطة ومائة شيء آخر لا تحتاجه لمدونة. ستشحن وقت تشغيل React إلى كل زائر سواء احتاج إلى التفاعل أم لا (مكونات خادم App Router تساعد، لكن الحزمة الأساسية لا تزال أثقل). يكون Next.js منطقياً عندما تبني منتج SaaS أو موقع بوظائف ديناميكية ثقيلة -- لوحات معلومات المستخدم والتجارة الإلكترونية والميزات في الوقت الفعلي. بالنسبة لترحيل المحتوى من WordPress؟ إنها مفرطة. ومع ذلك، إذا كان موقعك يحتاج فعلاً إلى تلك الميزات، فإن فريق Next.js لدينا يمكنه مساعدتك في معرفة البنية المناسبة.
Gatsby
Gatsby في الأساس في وضع الصيانة. استحوذت Netlify عليها في 2023، والتطوير توقف إلى خيط زحف. طبقة بيانات GraphQL التي بدت ذكية في السابق تبدو الآن مثل التعقيد غير الضروري. أوقات الإنشاء للمواقع الكبيرة مؤلمة. النظام البيئي للإضافة قديم. أود أن أوصي بشدة ضد بدء مشروع Gatsby جديد في 2026. إذا كنت حالياً على Gatsby، فإن الترحيل إلى Astro أسهل فعلاً من الترحيل من WordPress لأن محتواك يقع على الأرجح بالفعل في markdown.
| الميزة | Astro | Next.js | Gatsby |
|---|---|---|---|
| JS الافتراضي المشحون | 0 KB | ~85-100 KB | ~70-90 KB |
| مجموعات المحتوى | مدمجة، آمنة النوع | إعداد يدوي | طبقة GraphQL |
| وقت الإنشاء (1000 منشور) | ~30-45s | ~60-90s | ~120-300s |
| منحنى التعلم | منخفض | متوسط-مرتفع | متوسط |
| الأفضل ل | مواقع المحتوى | تطبيقات الويب | المشاريع القديمة |
| التطوير النشط | نشط جداً | نشط جداً | ضئيل |
| دعم SSR | اختياري | افتراضي | محدود |
دليل الترحيل بـ 7 خطوات
إليق العملية الدقيقة التي أتبعها. بدون كلام غير واضح.
الخطوة 1: تدقيق موقع WordPress الخاص بك
قبل أن تلمس أي كود، تحتاج إلى معرفة ما تعمل معه. قم بتسجيل الدخول إلى مسؤول WordPress وقم بقائمة المخزون.
# إذا كان لديك WP-CLI مثبتاً (يجب أن يكون)
wp post list --post_type=post --format=csv --fields=ID,post_title,post_name,post_date > posts.csv
wp post list --post_type=page --format=csv --fields=ID,post_title,post_name,post_date > pages.csv
wp plugin list --format=table
wp theme list --format=table
توثيق كل إضافة وما تفعله. ستحتاج إلى العثور على معادلات Astro أو إسقاطها. الأشهر:
- Yoast SEO → إدارة
<head>المدمجة في Astro +@astrojs/sitemap - Contact Form 7 → Formspree أو Formspark أو دالة خادمة بدون خادم
- WP Super Cache / W3 Total Cache → غير مطلوب (موقعك بالفعل ثابت)
- Wordfence / Sucuri → غير مطلوب (لا خادم للحماية)
- إضافة Google Analytics → علامة نصية مباشرة أو تكامل Partytown
- WooCommerce → Snipcart أو Shopify Buy Button أو منصة تجارة إلكترونية مخصصة
الخطوة 2: تصدير محتوى WordPress
لديك خياران: تصدير XML أو REST API. أوصي بتصدير XML لمعظم المواقع لأنه يجسد كل شيء في لقطة واحدة.
في مسؤول WordPress: Tools → Export → All Content → Download Export File
يعطيك هذا ملف .xml يحتوي على كل منشور وصفحة وتعليق وحقل مخصص وفئة وعلامة ومرجع وسائط.
بالنسبة للمواقع الأكبر (1000+ منشور)، نهج REST API أكثر موثوقية:
// scripts/export-wp.mjs
import fs from 'fs/promises';
import path from 'path';
const WP_URL = 'https://your-wordpress-site.com/wp-json/wp/v2';
const PER_PAGE = 100;
async function fetchAllPosts() {
let page = 1;
let allPosts = [];
while (true) {
const res = await fetch(
`${WP_URL}/posts?per_page=${PER_PAGE}&page=${page}&_embed`
);
if (!res.ok) break;
const posts = await res.json();
if (posts.length === 0) break;
allPosts = allPosts.concat(posts);
console.log(`Fetched page ${page} (${allPosts.length} posts total)`);
page++;
}
return allPosts;
}
const posts = await fetchAllPosts();
await fs.writeFile('wp-posts.json', JSON.stringify(posts, null, 2));
console.log(`Exported ${posts.length} posts`);
الخطوة 3: سقالة مشروع Astro الخاص بك
npm create astro@latest my-new-site
cd my-new-site
# أضف التكاملات التي ستحتاجها
npx astro add mdx
npx astro add sitemap
npx astro add tailwind
# ثبت التبعيات الإضافية
npm install sharp @astrojs/rss
أوصي بـ البدء بإعداد بسيط بدلاً من موضوع. المواضيع تضيف تعقيداً لا تحتاجه أثناء الترحيل. احصل على المحتوى يعمل أولاً، ثم صممه.
الخطوة 4: تحويل المحتوى إلى Markdown
هنا حيث يحدث العمل الحقيقي. تحتاج إلى تحويل محتوى HTML من WordPress إلى markdown نظيفة مع frontmatter مناسب.
أستخدم سكريبت Node.js مخصص مع turndown لتحويل HTML إلى markdown:
npm install turndown @wordpress/block-serialization-default-parser
// scripts/convert-posts.mjs
import TurndownService from 'turndown';
import fs from 'fs/promises';
import path from 'path';
const turndown = new TurndownService({
headingStyle: 'atx',
codeBlockStyle: 'fenced',
});
// التعامل مع HTML محددة من WordPress
turndown.addRule('wpCaption', {
filter: (node) => {
return node.nodeName === 'DIV' &&
node.className.includes('wp-caption');
},
replacement: (content, node) => {
const img = node.querySelector('img');
const caption = node.querySelector('.wp-caption-text');
return `\n`;
},
});
const posts = JSON.parse(await fs.readFile('wp-posts.json', 'utf-8'));
for (const post of posts) {
const slug = post.slug;
const markdown = turndown.turndown(post.content.rendered);
const frontmatter = `---
title: "${post.title.rendered.replace(/"/g, '\\"')}"
date: ${post.date}
excerpt: "${(post.excerpt.rendered || '').replace(/<[^>]*>/g, '').trim().replace(/"/g, '\\"')}"
categories: [${(post._embedded?.['wp:term']?.[0] || []).map(c => `"${c.name}"`).join(', ')}]
tags: [${(post._embedded?.['wp:term']?.[1] || []).map(t => `"${t.name}"`).join(', ')}]
featuredImage: "${post._embedded?.['wp:featuredmedia']?.[0]?.source_url || ''}"
draft: false
---`;
const content = `${frontmatter}\n\n${markdown}\n`;
await fs.mkdir('src/content/blog', { recursive: true });
await fs.writeFile(`src/content/blog/${slug}.md`, content);
console.log(`Converted: ${slug}`);
}
الخطوة 5: تحميل وتنظيم الوسائط
يتم تخزين الوسائط على WordPress في دلائل wp-content/uploads/YYYY/MM/. تحتاج إلى تحميل كل شيء وتحديث المراجع.
# سريع وقذر: مرآة wget لدليل التحميلات الخاص بك
wget -r -np -nH --cut-dirs=2 -P public/uploads \
https://your-wordpress-site.com/wp-content/uploads/
# ثم ابحث واستبدل عناوين URL القديمة في ملفات markdown
find src/content/blog -name '*.md' -exec sed -i '' \
's|https://your-wordpress-site.com/wp-content/uploads/|/uploads/|g' {} +
بالنسبة لترحيلات الإنتاج، أستخدم تحسين صورة Astro مع مكتبة sharp لتحويل كل شيء إلى WebP وإنشاء أحجام مسؤولة في وقت الإنشاء. يمكن لهذا وحده أن يقلل حمل الصورة بنسبة 40-60%.
الخطوة 6: بناء التخطيطات والمكونات
قم بإنشاء تخطيطات Astro لمطابقة (أو تحسين) بنية موضوع WordPress. في الحد الأدنى ستحتاج:
src/layouts/BaseLayout.astro-- غلاف HTML و<head>والتنقل والتذييلsrc/layouts/BlogLayout.astro-- قالب منشور واحدsrc/pages/blog/index.astro-- قائمة المدونة مع الترقيمsrc/pages/blog/[...slug].astro-- صفحات منشور ديناميكيةsrc/pages/index.astro-- الصفحة الرئيسية
الخطوة 7: الاختبار والإعادة والنشر
بناء محلياً والتحقق من كل شيء:
npm run build
npm run preview
# تحقق من الروابط المكسورة
npx linkinator http://localhost:4321 --recurse
قم بإعداد عمليات إعادة التوجيه (مغطاة بالتفصيل أدناه)، وقم بتكوين DNS الخاص بك، وقم بالنشر. سأغطي خيارات الاستضافة في قسم مقارنة التكاليف.
تصدير بيانات WordPress إلى مجموعات محتوى Astro
مجموعات محتوى Astro هي إحدى أفضل ميزاتها. تمنحك وصول آمن النوع إلى محتوى markdown الخاص بك مع التحقق من صحة المخطط. إليك كيفية إعدادها بشكل صحيح للمحتوى المترحّل من WordPress.
تحديد مخطط الخاص بك
// src/content.config.ts
import { defineCollection, z } from 'astro:content';
import { glob } from 'astro/loaders';
const blog = defineCollection({
loader: glob({ pattern: '**/*.{md,mdx}', base: './src/content/blog' }),
schema: z.object({
title: z.string(),
date: z.coerce.date(),
excerpt: z.string().optional(),
categories: z.array(z.string()).default([]),
tags: z.array(z.string()).default([]),
featuredImage: z.string().optional(),
draft: z.boolean().default(false),
}),
});
export const collections = { blog };
جمال هذا: إذا كان أي من منشوراتك المترحّلة يحتوي على frontmatter مفقود أو مشكل، فإن Astro سيخبرك في وقت الإنشاء برسالة خطأ واضحة. لا فشل صامت.
التعامل مع WordPress Shortcodes
هذا هو الالتقاط الذي تخطيه معظم أدلة الترحيل. إذا كانت منشورات WordPress الخاصة بك تستخدم shortcodes مثل [gallery] و [caption] و [embed] أو أي shortcodes مخصصة من الإضافات، فستظهر كنص خام في markdown الخاص بك.
لديك ثلاثة خيارات:
- المعالجة المسبقة أثناء التحويل -- اكتب قواعد regex في سكريبت التحويل الخاص بك لتحويل shortcodes إلى معادلات markdown أو HTML
- استخدام MDX -- حول المنشورات المتأثرة إلى
.mdxوأنشئ مكونات Astro التي تحل محل shortcodes - البحث والاستبدال يدويا -- بالنسبة للمواقع الصغيرة، أحياناً يكون الأسرع
// مثال: تحويل WordPress gallery shortcode أثناء التحويل
function convertShortcodes(content) {
// [gallery ids="1,2,3"]
content = content.replace(
/\[gallery ids="([^"]+)"\]/g,
(match, ids) => {
const imageIds = ids.split(',');
return imageIds.map(id => `}.jpg)`).join('\n');
}
);
// [youtube url="..."]
content = content.replace(
/\[youtube[^\]]*url="([^"]+)"[^\]]*\]/g,
(match, url) => `<iframe src="${url}" width="560" height="315" frameborder="0"></iframe>`
);
return content;
}
استعلام المحتوى
بمجرد أن يكون محتواك في مجموعات، استعلام عنه أمر مباشر:
---
// src/pages/blog/index.astro
import { getCollection } from 'astro:content';
import BlogLayout from '../../layouts/BlogLayout.astro';
const posts = (await getCollection('blog'))
.filter(post => !post.data.draft)
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf());
---
<BlogLayout title="Blog">
<ul>
{posts.map(post => (
<li>
<a href={`/blog/${post.slug}/`}>
<h2>{post.data.title}</h2>
<time>{post.data.date.toLocaleDateString()}</time>
<p>{post.data.excerpt}</p>
</a>
</li>
))}
</ul>
</BlogLayout>
الحفاظ على SEO: إعادات التوجيه 301 والخريطة والبيانات المنظمة
هذا القسم حرج. يمكن لترحيل مُفسّد أن يدمر سنوات من رأس المال SEO بين عشية وضحاها. لا تتخطى أي من هذا.
هيكل الرابط وإعادات التوجيه 301
WordPress الافتراضي هو عناوين URL مثل /2024/03/my-post-title/ أو /?p=123. تحتاج إلى خريطة كل عنوان URL قديم إلى معادله Astro الجديد.
أولاً، قم بإنشاء قائمة كاملة من عناوين URL القديمة:
# استخدام WP-CLI
wp post list --post_type=post,page --field=url > old-urls.txt
# أو زحف خريطة الموقع
curl -s https://your-site.com/sitemap.xml | grep -oP '<loc>\K[^<]+'
بالنسبة إلى Vercel، أنشئ vercel.json في جذر مشروعك:
{
"redirects": [
{ "source": "/2024/03/my-old-post/", "destination": "/blog/my-old-post/", "permanent": true },
{ "source": "/:year(\\d{4})/:month(\\d{2})/:slug/", "destination": "/blog/:slug/", "permanent": true },
{ "source": "/category/:slug/", "destination": "/blog/category/:slug/", "permanent": true },
{ "source": "/feed/", "destination": "/rss.xml", "permanent": true }
]
}
بالنسبة إلى Netlify، استخدم _redirects في مجلد public/ الخاص بك:
/2024/03/my-old-post/ /blog/my-old-post/ 301
/category/* /blog/category/:splat 301
/feed/ /rss.xml 301
بالنسبة إلى Cloudflare Pages، استخدم _redirects (نفس تنسيق Netlify) أو Bulk Redirects في لوحة التحكم.
توليد خريطة الموقع
يتعامل تكامل @astrojs/sitemap مع هذا تلقائياً:
// astro.config.mjs
import { defineConfig } from 'astro/config';
import sitemap from '@astrojs/sitemap';
export default defineConfig({
site: 'https://your-new-site.com',
integrations: [sitemap()],
});
بعد النشر، قدم خريطة الموقع الجديدة في Google Search Console على الفور. أيضاً قدم طلب إزالة لأي عناوين URL لم تعد موجودة ولم تُعد توجيهها.
البيانات المنظمة / ترميز البيانات الوصفية
إذا كانت Yoast تتعامل مع ترميز البيانات الوصفية الخاص بك، فأنت بحاجة إلى تكرارها. أنشئ مكونة قابلة لإعادة الاستخدام:
---
// src/components/ArticleSchema.astro
const { title, date, excerpt, image, author = 'Your Name' } = Astro.props;
const schema = {
"@context": "https://schema.org",
"@type": "BlogPosting",
"headline": title,
"datePublished": date,
"description": excerpt,
"image": image,
"author": {
"@type": "Person",
"name": author
}
};
---
<script type="application/ld+json" set:html={JSON.stringify(schema)} />
ملف RSS
لا تنسَ مشتركي RSS الخاص بك:
// src/pages/rss.xml.js
import rss from '@astrojs/rss';
import { getCollection } from 'astro:content';
export async function GET(context) {
const posts = await getCollection('blog');
return rss({
title: 'Your Site',
description: 'Your description',
site: context.site,
items: posts.map(post => ({
title: post.data.title,
pubDate: post.data.date,
description: post.data.excerpt,
link: `/blog/${post.slug}/`,
})),
});
}
مقارنة تكاليف الاستضافة
هنا حيث تصبح الحالة التجارية للترحيل مستحيلة تجاهلها.
| سيناريو الاستضافة | تكلفة شهرية | تكلفة سنوية | ملاحظات |
|---|---|---|---|
| WP Engine (WordPress مُدار) | $30-60 | $360-720 | خطط Startup-Growth |
| Kinsta (WordPress مُدار) | $35-70 | $420-840 | خطط Starter-Business |
| Flywheel (WordPress مُدار) | $15-30 | $180-360 | خطط Tiny-Personal |
| مستضاف ذاتياً (DigitalOcean + الصيانة) | $12-24 | $144-288 | بالإضافة إلى وقتك للتحديثات |
| Astro على Vercel (Hobby) | $0 | $0 | 100GB bandwidth/mo |
| Astro على Netlify (مجاني) | $0 | $0 | 100GB bandwidth/mo |
| Astro على Cloudflare Pages (مجاني) | $0 | $0 | نطاق ترددي غير محدود |
| Astro على Vercel (Pro) | $20 | $240 | 1TB bandwidth وميزات الفريق |
بالنسبة للغالبية العظمى من مواقع المحتوى -- المدونات والمحافظ والمواقع التوثيقية ومواقع التسويق -- فإن المستويات المجانية على Vercel أو Netlify أو Cloudflare Pages كافية أكثر من كافية. أنت تخدم ملفات ثابتة من CDN عالمي. موقع يحصل على 100000 مشهد صفحة في الشهر سيكاد يخدش حدود المستوى المجاني.
دعني أوضح الرياضيات. إذا كنت تدفع 50 دولاراً/شهر لاستضافة WordPress المُدارة، فهذا 600 دولار/سنة. على مدى ثلاث سنوات، هذا 1800 دولار. أضف رخص الإضافات المتميزة (Yoast Premium بـ 99 دولار/سنة و Elementor Pro بـ 59 دولار/سنة و WP Rocket بـ 59 دولار/سنة)، وأنت تبحث عن 800-1000 دولار سنوياً لموقع محتوى يمكن استضافته مجاناً.
الترحيل نفسه هو تكلفة لمرة واحدة. إذا تعاملت معها بنفسك، فهي وقتك. إذا قمت بتوظيف فريق مثل فريقنا من خلال خدمات تطوير CMS بدون رأس، فإن عائد الاستثمار عادةً يتعادل خلال 6-12 شهراً فقط من توفير الاستضافة -- ناهيك عن تحسينات الأداء و SEO. تحقق من صفحة التسعير لديك للحصول على التفاصيل.
ولكن ماذا عن الميزات الديناميكية؟
الاعتراض الأكثر شيوعاً: "موقع WordPress الخاص بي يحتوي على نماذج الاتصال والبحث والتعليقات والتجارة الإلكترونية."
- نماذج الاتصال: Formspree (المستوى المجاني: 50 تقديم/شهر)، Formspark، أو دالة خادمة بدون خادم بسيطة
- البحث: Pagefind (مجاني، يعمل بالكامل على الجانب العميل، مُنشأ للمواقع الثابتة) -- إنه مذهل
- التعليقات: Giscus (مجاني، مدعوم بـ GitHub)، أو Disqus إذا كان يجب
- التجارة الإلكترونية: Snipcart أو Shopify Lite أو Stripe Checkout
- اشتراكات النشرة الإخبارية: استدعاءات API المباشرة إلى ConvertKit أو Mailchimp أو Buttondown
لا شيء من هذا يتطلب خادماً. لا أي منهم يضيف تكلفة ذات مغزى.
الأسئلة الشائعة
كم من الوقت يستغرق ترحيل WordPress إلى Astro؟
بالنسبة لمدونة نموذجية بـ 50-200 منشور، تتوقع 1-2 أسبوع من العمل بدوام جزئي إذا كنت تفعل ذلك بنفسك. تحويل المحتوى عادةً يستغرق يوماً واحداً مع نص جيد. بناء تخطيطات ومكونات Astro يستغرق 2-4 أيام حسب تعقيد التصميم. الاختبار وإعداد إعادة التوجيه والنشر يستغرق يوماً إلى يومين آخر. بالنسبة للمواقع الأكبر (500+ منشور) أو المواقع التي تحتوي على أنواع منشورات مخصصة معقدة وتبعيات الإضافات، قم بميزانية 3-6 أسابيع. إذا كنت تفضل تسليمها، تواصل مع فريقنا -- نكمل الترحيلات عادةً في 2-4 أسابيع.
هل يمكن لـ Astro التعامل مع مدونة WordPress بـ 1000+ منشور؟
بالتأكيد. لقد قمت بترحيل مواقع بأكثر من 3000 منشور وبقيت أوقات الإنشاء أقل من دقيقتين. تم تحسين مجموعات المحتوى لمجموعات البيانات الكبيرة، وبما أن كل شيء يُترجم إلى HTML ثابت، لا توجد عقوبة أداء وقت التشغيل بغض النظر عن حجم المحتوى. خطوة الإنشاء هي المكان الوحيد حيث يحدث النطاق، وأداء البناء في Astro ممتازة -- أسرع بكثير من Gatsby أو Next.js للمحتوى الثابت على نطاق واسع.
هل يدعم Astro تعليقات WordPress؟
لا بشكل أصلي، وبصراحة هذه ميزة وليست مشكلة. تعليقات WordPress هي مغناطيس للبريد العشوائي التي تتطلب تعديلاً مستمراً. بالنسبة لمواقع Astro، الخيارات الأفضل هي: Giscus (يستخدم GitHub Discussions -- مجاني، بدون تتبع، رائع للجماهير من المطورين)، Disqus (الخيار القديم، به إعلانات على المستوى المجاني)، Commento (يركز على الخصوصية، 5 دولارات/شهر)، أو حل مخصص باستخدام قاعدة بيانات مثل Turso أو Supabase مع مسار API Astro. إذا كنت تريد الحفاظ على تعليقات WordPress الموجودة، قم بتصديرها وعرضها كمحتوى ثابت، ثم استخدم إحدى هذه الخدمات للتعليقات الجديدة.
هل Astro أسرع من WordPress؟
إنها ليست حتى مقارنة. موقع Astro الثابت سيتفوق على حتى إعداد WordPress الأكثر تحسناً لأنه يلغي الاختناق الأساسي: معالجة من جانب الخادم. يجب على WordPress تنفيذ PHP والاستعلام من قاعدة البيانات وتجميع الصفحة وإرسالها -- لكل طلب (ما لم يتم تخزينه مؤقتاً). قم بإعادة بناء Astro كل شيء مسبقاً. يتلقى الزائرون HTML معروضة مسبقاً مباشرة من عقدة حافة CDN بالقرب منهم. التحسينات النموذجية هي أوقات تحميل أسرع بـ 80-90% وتحسينات درجة Lighthouse بـ 60-80 نقطة.
ماذا يحدث لمسؤول WordPress والمحرر WYSIWYG؟
تفقد لوحة إدارة WordPress. بالنسبة لمعظم المطورين، هذا ارتياح. ستحرر ملفات markdown مباشرة، والتي أسرع وأكثر قابلية للنقل. إذا كان لديك محررو محتوى غير تقنيين يحتاجون إلى واجهة مرئية، فكر في النهج الخالي من الرأس: احتفظ بـ WordPress يعمل كخادم محتوى خلفي واستخدم Astro كواجهة أمامية. أو اجمع Astro مع CMS خالي من الرأس مثل Sanity أو Contentful أو Storyblok أو Keystatic (التي لديها محرر قائم على GitHub لطيف حقاً). خدمات تطوير CMS بدون رأس لدينا يمكن أن تساعدك على اختيار خادم المحتوى المناسب لفريقك.
هل ستنخفض تصنيفات Google الخاصة بي بعد الترحيل؟
لا يجب أن تفعل، وفي معظم الحالات تتحسن -- لكن فقط إذا تعاملت مع عمليات إعادة التوجيه بشكل صحيح. يجب أن يعمل كل عنوان URL قديم أو يعاد توجيهه 301 إلى معادله الجديد. قدم خريطة الموقع الجديدة إلى Google Search Console في نفس يوم الإطلاق. راقب تقرير Index Coverage لأول 30 يوماً. لقد رأيت مواقع تكسب 15-30% من حركة بحث عضوية خلال شهرين إلى ثلاثة أشهر من الترحيل فقط من تحسينات Core Web Vitals، لأن Google تستخدم إشارات تجربة الصفحة كعامل تصنيف.
هل يمكنني الاحتفاظ بـ WordPress كـ CMS بدون رأس واستخدام Astro للواجهة الأمامية؟
نعم، وهذا نهج وسط رائع. تحافظ على تجربة محرر WordPress والإدارة لكنك تتخلص من الواجهة الأمامية PHP بالكامل. يجلب Astro المحتوى من REST API للـ WordPress (أو WPGraphQL) في وقت الإنشاء وينشئ صفحات ثابتة. ستظل بحاجة لاستضافة WordPress في مكان ما، لذلك لن توفر تكاليف الاستضافة، لكنك تحصل على جميع فوائد أداء الواجهة الأمامية. بالنسبة للفريق المستثمر بكثرة في سير عمل تحرير WordPress، هذا غالباً ما يكون الخيار العملي.
هل أحتاج إلى معرفة React أو أي إطار عمل JavaScript لاستخدام Astro؟
لا. تستخدم مكونات Astro تنسيق ملف .astro يبدو وكأنه HTML مع كتلة نصية frontmatter. إذا كان يمكنك كتابة HTML و CSS، يمكنك بناء موقع Astro. إطارات عمل JavaScript (React و Vue و Svelte) اختيارية -- ستحضرها فقط إذا احتجت إلى مكونات تفاعلية من جانب العميل مثل عنصر واجهة بحث أو نموذج بتحقق أو دوران صور. بالنسبة لمدونة أو موقع تسويق، يمكنك بناء الموقع بالكامل بدون لمس React.