الفرق بين المراجعتين لصفحة: «Next.js/supported browsers features»

من موسوعة حسوب
لا ملخص تعديل
لا ملخص تعديل
سطر 3: سطر 3:


== موائمة الشيفرة لدعم المتصفحات المختلفة في Next.js ==
== موائمة الشيفرة لدعم المتصفحات المختلفة في Next.js ==
تدفع Next.js صراحةً بشيفرات موائمة polyfills لازمة لدعم المتصفح IE11 كما تدفع بشيفرات موائمة مستخدمة على نطاق واسع بما فيها:
تدفع Next.js صراحةً بشيفرات موائمة polyfills لازمة لدعم المتصفح IE11 كما تدفع بشيفرات موائمة مستخدمة على نطاق واسع بما فيها:


* [https://academy.hsoub.com/programming/javascript/%D8%A7%D8%B3%D8%AA%D8%B9%D9%85%D8%A7%D9%84%D8%A7%D8%AA-%D9%85%D8%AA%D9%82%D8%AF%D9%85%D8%A9-%D9%84%D9%84%D9%88%D8%A7%D8%AC%D9%87%D8%A9-%D8%A7%D9%84%D8%A8%D8%B1%D9%85%D8%AC%D9%8A%D8%A9-fetch-%D9%81%D9%8A-%D8%AC%D8%A7%D9%81%D8%A7%D8%B3%D9%83%D8%B1%D8%A8%D8%AA-r1297/ ()fetch]: يستبدل <code>whatwg-fetch</code> و <code>unfetch</code>
* [https://academy.hsoub.com/programming/javascript/%D8%A7%D8%B3%D8%AA%D8%B9%D9%85%D8%A7%D9%84%D8%A7%D8%AA-%D9%85%D8%AA%D9%82%D8%AF%D9%85%D8%A9-%D9%84%D9%84%D9%88%D8%A7%D8%AC%D9%87%D8%A9-%D8%A7%D9%84%D8%A8%D8%B1%D9%85%D8%AC%D9%8A%D8%A9-fetch-%D9%81%D9%8A-%D8%AC%D8%A7%D9%81%D8%A7%D8%B3%D9%83%D8%B1%D8%A8%D8%AA-r1297/ ()fetch]: يستبدل <code>whatwg-fetch</code> و <code>unfetch</code>
سطر 21: سطر 21:


* الدوال غير المتزامنة ودوال الانتظار [[JavaScript/await|Async/await]] الإصدار (ES2017) من JavaScript
* الدوال غير المتزامنة ودوال الانتظار [[JavaScript/await|Async/await]] الإصدار (ES2017) من JavaScript
* [https://github.com/tc39/proposal-object-rest-spread Object Rest/Spread Properties] الإصدار (ES2018) من JavaScript
* [https://github.com/tc39/proposal-object-rest-spread Object Rest/Spread Properties] الإصدار (ES2018) من JavaScript
* دالة <code>()import</code> الديناميكية [https://github.com/tc39/proposal-dynamic-import ()Dynamic import] الإصدار (ES2020) من JavaScript
* دالة <code>()import</code> الديناميكية [https://github.com/tc39/proposal-dynamic-import ()Dynamic import] الإصدار (ES2020) من JavaScript
* السلسلة الاختيارية [https://github.com/tc39/proposal-optional-chaining Optional Chaining] الإصدار (ES2020) من JavaScript
* السلسلة الاختيارية [https://github.com/tc39/proposal-optional-chaining Optional Chaining] الإصدار (ES2020) من JavaScript
سطر 32: سطر 32:


=== تخصيص إعدادات ناقل الشيفرة Babel ===
=== تخصيص إعدادات ناقل الشيفرة Babel ===
يمكنك الاطلاع على الموضوع بشكل أوسع في [[Next.js/customizing babel config|الصفحة الخاصة بتهيئة Babel]].
يمكنك الاطلاع على الموضوع بصورة أوسع في [[Next.js/customizing babel config|الصفحة الخاصة بتهيئة Babel]].


== المصادر ==
== المصادر ==


* الصفحة [https://nextjs.org/docs/basic-features/supported-browsers-features Supported Browsers and Features] في Next.js توثيق الرسمي
* الصفحة [https://nextjs.org/docs/basic-features/supported-browsers-features Supported Browsers and Features] في Next.js توثيق الرسمي

مراجعة 14:51، 30 مايو 2022

تدعم Next.js المتصفح IE11 وجميع المتصفحات الحديثة (Edge و Firefox و Chrome و Safari و Opera وغيرها) دون الحاجة إلى أية تهيئة إضافية.

موائمة الشيفرة لدعم المتصفحات المختلفة في Next.js

تدفع Next.js صراحةً بشيفرات موائمة polyfills لازمة لدعم المتصفح IE11 كما تدفع بشيفرات موائمة مستخدمة على نطاق واسع بما فيها:

  • ()fetch: يستبدل whatwg-fetch و unfetch
  • URL: يستبدل حزمة url (في واجهة Node.js البرمجية )
  • ()Object.assign: يستبدل object-assign و object.assign و core-js/object/assign.

إن احتوت أية اعتمادية من اعتمادياتك على هذه الشيفرات فستُحذف تلقائيًا من نسخة الإنتاج لتفادي التكرار. ولتقليل حجم التجميعات، تُحمِّل Next.js شيفرات الموائمة هذه للمتصفحات التي تحتاجها، بينما لن تراها في بقية الحالات.

شيفرات الموائمة من جانب الخادم

تدفع Next.js بالدالة ()fetch لموائمة الشيفرة في بيئة عمل على الخادم بالإضافة إلى بيئة العميل. وبإمكانك استخدام ()fetch في الشيفرة التي تنفذها على الخادم (مثل getStaticProps أو getServerSideProps) دون الحاجة لاستخدام شيفرات موائمة مثل isomorphic-unfetch أو node-fetch.

شيفرات موائمة مخصصة

إن احتاجت شيفرتك أو أية اعتمادية من اعتماديات npm إلى ميزات لا يدعمها المتصفح المستهدف، فلا بد من موائمة الشيفرة بنفسك. عليك في هذه الحالات إضافة عبارة إدراج import (من المستوى الأعلى) لشيفرة الموائمة المحددة التي تحتاجها في تطبيقك المخصص أو في المكوِّن المطلوب.

دعم ميزات JavaScript في Next.js

تتيح Next.js استخدام آخر ميزات صدرت للغة JavaScript. إذ تدعم إضافة إلى ميزات ES6 ما يلي:

  • الدوال غير المتزامنة ودوال الانتظار Async/await الإصدار (ES2017) من JavaScript
  • Object Rest/Spread Properties الإصدار (ES2018) من JavaScript
  • دالة ()import الديناميكية ()Dynamic import الإصدار (ES2020) من JavaScript
  • السلسلة الاختيارية Optional Chaining الإصدار (ES2020) من JavaScript
  • الدمج اللاغي Nullish Coalescing الإصدار (ES2020) من JavaScript
  • حقول الأصناف Class Fields والخاصيات الساكنة Static Properties (جزء من اقتراحات المرحلة 3).
  • وغيرها الكثير.

دعم ميزات TypeScript

تدعم Next.js اللغة TypeScript بميزات مدمجة معها. اطلع على الصفحة التي توثق هذا الموضوع.

تخصيص إعدادات ناقل الشيفرة Babel

يمكنك الاطلاع على الموضوع بصورة أوسع في الصفحة الخاصة بتهيئة Babel.

المصادر