⚛️ تانر لينسلي بنى React Clone في يوم واحد — ده ليه مهم
أسبوع الفيت، تانر لينسلي — مبتكر TanStack Query، Table، Router، ونصف المكتبات اللي بتحافظ على تطبيقات React الحديثة — عمل حاجة غيرت رؤوس الناس في مجتمع الفرونت إند. لما قعد يوم كامل يطلب من وكيل إيه آي يعيد إنشاء واجهة برمجة تطبيقات React العامة كرونتايم بحجم ~9KB، ونشره بكل هدوء على بلوجه وتانستاك.كوم، وبعدين... صرف النظر! النتيجة؟ رونتايم متوافق مع React بيشتغل 2-3 مرة أسرع من رياكت الأصلي، ومحدد خصيصاً لتانستاك ستارت. هفكّر ليه ده مهم — مش بس كديمو رائع، ولا كإشارة عن اتجاه الفرونت إند.
ما اللي حصل بالفعل
تانر اخد واجهة برمجة تطبيقات رياكت العامة — useState، useEffect، createContext، createElement، كل اللي فيها — وجعله وكيل إيه آي يعيد تنفيذها من الصفر. الناتج هو رونتايم بحجم ~9KB متوافق مع رياكت من ناحية واجهة البرمجة، ولكن محسّن لاحتياجات تانستاك ستارت بشكل خاص.
// ده شغال تماماً زي ما تتوقع — بس أسرع
import { useState, useEffect } from '@tanstack/react-like'
function Counter() {
const [count, setCount] = useState(0)
useEffect(() => {
document.title = `Count: ${count}`
}, [count])
return <button onClick={() => setCount(c => c + 1)}>{count}</button>
}
الفكرة الرئيسية: بالتخلص من التوافق الخلفي مع أنماط رياكت القديمة وتحسين الأداء لسياق محدد من الروتر/الإطار، ممكن تتخلص من عبء رونتايم كبير.
ليه أسرع 2-3 مرة؟
رياكت الأصلي يحمل عقود من قرارات التصميم. الريكونسيلر، نظام الحدث، بنية الفايبر — كلها مبنية لأقصى مرونة عبر كل الحالات الممكنة. ده القرار الصحيح لمكتبة عامة الغرض. ولكن لو كنت بتبني إطار مع قيود معروفة (زي روتينج الملفات والستريمينج اس اس آر بتانستاك ستارت)، ممكن تعمل تحسينات جريئة:
- تخفيض إعادة التوجيه: لو كنت عارف شكل شجرة المكونات في وقت البيلد، ممكن تتخطى العمل في وقت التشغيل
- حزمة أصغر: 9KB مضغوط مقابل ~42KB لرياكت يعني أقل تحليل وأقل ذاكرة
- تخطيط متخصص: مش محتاج تعقيد الوضع التتابعي لما الروتينج بيضمن نمط معين
الصورة الأكبر: دواخل الإطارات المولدة بواسطة الإيه آي
الأكثر إثارة للجدل في هذه القصة مش أرقام الأداء — هو كيف تم بناؤها. وكيل إيه آي مولد ده في يوم واحد. ده قدرة ما لسه مش عرفناها بعد كدا. فكّر في اللي بيفتحه ده:
- تجارب الإطارات بتصبح رخيصة: عايز تجرب خوارزمية إعادة توجيه مختلفة؟ وصفها، وخلّي الإيه آي يبنيها، واختبار، وتكرار.
- رونتايمات محددة للمجال: مواقع التجارة الإلكترونية مش محتاجة نفس ميزات رياكت اللي بيحتاجها
لوحة بيانات. أصبحت البيئات التشغيلية المخصصة للتحميل الخاص بك ممكنة.
- أدوات التدريس: نسخة مخففة من React هي أفضل طريقة لفهم كيفية عمل React داخليًا. هذا يمكن أن يكون موردًا تعليميًا رائعًا.
هل يجب عليك استخدامه؟
على الأرجح لا في الإنتاج — على الأقل ليس بعد. تانر نفسه لا يصدره بشكل صحيح (على الرغم من أنه موجود على npm إذا كنت من المحبين لمعرفة المزيد). إنه تجربة، وبرهان على المفهوم، ونظرة على ما سيأتي. ولكن النمط يستحق الانتباه. نحن ندخل عصرًا حيث:
- أصبحت内部يات الإطار أشياء عادية (يمكن للذكاء الاصطناعي توليدها)
- انتقلت تحسين الأداء من "الحالة العامة" إلى "حالة الاستخدام الخاصة"
- تلاشى الحد الفاصل بين مؤلف الإطار ومستهلك الإطار
الخلاصة
نسخة تانر من React ليست بديلاً عن React. إنها نذير. عندما يمكن إعادة تنفيذ واجهة برمجة التطبيقات العامة للإطار في يوم واحد بواسطة الذكاء الاصطناعي ويعمل بسرعة 2-3 مرة، فهذا ي告诉نا أن قيمة React انتقلت من تنفيذها إلى نظامها البيئي وأعرافها وتجربة المطور. المرة القادمة التي يخبرك فيها شخص ما أن قطعة من البنية التحتية "معقدة للغاية لإعادة بنائها"، تذكر: شخص ما أعاد بناء React في يوم واحد.