این هفته در React شماره 136: Next.js، سیگنال‌ها، Bling، Suspense، مؤلفه‌های سرور، useSyncExternalStore، Expo، Reanimated، Metro…

سلام به همه!

این هفته، بحث پیرامون مدل سیگنال ادامه دارد. ما همچنین نسخه خوبی از Next.js داریم که از یک سیستم کش جدید برای تسهیل استفاده مؤثر از اجزای سرور در زمان اجرا بدون سرور Edge پرده برداری می کنیم.

فعالیت های زیادی نیز در سمت React-Native، با Expo 48، Expo Router 1.0، Expo Image 1.0، Reanimated 3.0، و ورود symlinks در مترو پشتیبانی می شود!

💡 برای دریافت ایمیل هر هفته در خبرنامه رسمی مشترک شوید!

💸 حامی

بلوک های قابل استفاده مجدد بسازید. مطالب را سریعتر منتشر کنید. Core Web Vitals و SEO را بهتر کنید.

ویرایشگرهای محتوا : یک تغییر دهنده بازی برای شرکت هایی که نیاز به تولید محتوای زیاد و استراتژی سئو قوی دارند. بازاریابان و ویراستاران محتوا می توانند صفحات را بدون هیچ گونه پیچیدگی ویرایش و منتشر کنند. تاخیرهای طولانی را حذف کنید و فورا منتشر کنید. صفحات و تصاویر به لطف Next.js بهینه شده اند تا به امتیازات Core Web Vitals عالی دست یابند.

توسعه دهندگان: با برنامه Next.js موجود خود وصل و بازی کنید. تعداد مزایای استفاده از Suncel CMS به عنوان توسعه دهنده:

• بلوک های قابل استفاده مجدد خود را در React بسازید
• متا SEO و نقشه سایت به طور خودکار تولید می شوند (به لطف ماژول SEO ما)
• تنظیمات سفارشی خود را در React ایجاد کنید
• Admin قابل تنظیم در React
• بدون نیاز به سیستم مسیریابی متناسب با CMS

از Suncel.io دیدن کنید | ویدیوی نمایشی 5 دقیقه

⚛️ واکنش نشان دهید

Next.js 13.2

یک نسخه خوب با برخی از ویژگی های جدید که توسعه دهندگان Vercel قبلاً پیش نمایشی از آن را در اختیار ما قرار داده بودند. API جدید Metadata برای SEO مفید است، با جریان SSR، اجزای سرور و فهرست برنامه جدید به خوبی کار می کند. به نظر می رسد که Route Handler های جدید قابلیت استفاده خوبی دارند: در محل مشترک، فقط فعل HTTP را صادر کنید. به ویژه از ویژگی‌های جدید پیرامون MDX (کامپایلر Rust، اجزای سرور) هیجان‌زده شده‌ایم: که باید سایت‌های محتوای Next.js را بسیار سبک‌تر و سریع‌تر در استفاده کنند. اگر درست متوجه شده باشم، Next.js شروع به استفاده از مرحله کدژن TypeScript برای پیوندهای تایپ شده (علاوه بر افزونه TypeScript) می کند. سازگاری Turbopack با لودرهای Webpack می تواند پذیرش باندلر جدید را آسان تر کند.

بزرگترین شگفتی برای من، معرفی یک API کش است که مستقیماً به آن ادغام شده است fetch(): برای هر درخواست مقداری مشابه ISR را می دهد، اما با دانه بندی دقیق تر، در سطح مؤلفه. حتی یک سیستم برچسب گذاری نیز وجود دارد. Next.js قابل حمل باقی می ماند: کش را می توان در زیرساخت خود میزبانی کرد یا از کش محلی LRU استفاده کرد. البته این برای استقرار در Vercel بهینه شده است. یک مقاله اختصاصی جزئیات بیشتری را ارائه می‌کند و محدودیت‌های مدل ISR را توضیح می‌دهد: Vercel Cache API: یک کش پیشرونده، یکپارچه با Next.js. را نیز ببینید موضوع سباستین مارکباگه.

تکامل سیگنال ها در جاوا اسکریپت

این مقاله توسط رایان کارنیاتو (SolidJS) تاریخچه سیگنال‌ها را از طریق KnockoutJS، MobX و بسیاری از راه‌حل‌های دیگر ردیابی می‌کند.

سیگنال ها همچنان موضوع پرطرفدار هفته هستند. پیشنهاد می‌کنم بحث‌های زیادی که در توییتر انجام شد را خودتان بخوانید:

• اندرو کلارک موضع خود را روشن می کند و است برای معرفی سیگنال به React بسته نیست. کامپایلر React Forget می تواند به سیگنال ها کامپایل شود.
• جنگل هیوری توضیح می دهد چگونه سیگنال ها از مشکلات پرف در پایه های حفاری جلوگیری می کنند.
• ایوان تو ترجیح می دهد یک مدل قابل تغییر قابل درک به یک مدل تغییرناپذیر که نشت می کند.
• دوون گووت به ما یادآوری می کند چرا “جریان داده های یک طرفه” اتخاذ شد و به برخی مشکلات سیگنال ها اشاره می کند.
• جردن واک اشاره می کند زمانی که React ایجاد شد، آنها استفاده از یک مدل واکنشی را در نظر گرفتند. رد شد زیرا معنای زبان را تغییر داد.
• و آبراموف توضیح می دهد که کاربر انتظار دارد یک رابط را برای داده های یکسان ببیند. او توضیح می دهد ارزش استفاده از “مقادیر خام” (در هیچ ظرفی پیچیده نشده است).
• موقعیت من: من تا حد زیادی نظرات مشابهی با تیم React دارم و فکر می‌کنم علیرغم اینکه سیگنال‌ها در کوتاه‌مدت جذاب به نظر می‌رسند، باید به نوآوری در مدل فعلی ادامه دهیم. من امیدوارم که در نهایت جاوا اسکریپت از مدل تغییرناپذیر بهتر پشتیبانی کند و کامپایلر React Forget تنها یک مرحله انتقالی باشد.

💸 حامی

ساخت و اجرای مانیتورینگ مصنوعی که مقیاس می شود

شما آن را بسازید؛ تو مالک آن هستی! این یک شعار ساده است که سال ها توسعه نرم افزار را هدایت کرده است. اما چگونه می‌توان برنامه‌های پیچیده React را به بهترین نحو رصد کرد؟

• اول: از Playwright برای تقلید از جریان های کاربر استفاده کنید و تضمین کنید که برنامه شما کار می کند.
• دوم: مطمئن باشید که APIهای مورد استفاده آماده و در حال اجرا هستند.

“مانیتورینگ به عنوان کد” – روشی جدید برای تعریف، آزمایش و استقرار کل نظارت برنامه شما به طور مستقیم از روی کد است.

• تنظیمات مانیتورینگ خود را کدنویسی کنید و کنترل نسخه را حفظ کنید
• برنامه خود را در محیط های پیش نمایش آزمایش کنید تا از اشکالات و رگرسیون جلوگیری کنید
• آزمایشات خود را اجرا کنید و نظارت بر تولید را شروع کنید

نظارت خود را به صورت رایگان در کنار کد خود بیاورید

📱 React-Native

نمایشگاه 48

انتشار خوب ما نکات برجسته نسخه بتا را می یابیم:

• React Native 0.71.3 – React 18.2.0
• بهبودهای یوگا (Flexbox) که با React-Native ارائه می شود
• سازندگان EAS تحت M1 به طور پیش فرض
• موتور هرمس به صورت پیش فرض
• همه ماژول های Expo از Fabric – آزمایشی پشتیبانی می کنند

برخی به روز رسانی ها از زمان بتا:

Reanimated 3.0

Reanimated 3.0 به تازگی در یک نسخه پایدار با ویژگی جدید Shared Elements Transitions منتشر شده است.نسخه ی نمایشی). اکنون می توان از مقادیر مشترک در سبک های درون خطی استفاده کرد. این کتابخانه برای بهبود عملکرد، DX و آماده سازی برای ورود ویژگی های جدید بازنویسی شده است. برای تسهیل ارتقا با Fabric و Reanimated 2 API سازگار است، اما Reanimated 1 API حذف شده است.

🧑‍💻 مشاغل

🧑‍💼 Passionfroot – مهندس ارشد تمام پشته (ریمیکس) – 160 هزار یورو +، برلین/ریموت

ماموریت Passionfroot توانمندسازی مشاغل مستقل فردا از طریق یوتیوب، پادکست ها، رسانه های اجتماعی و خبرنامه ها است. به ما بپیوندید تا ابزاری بسازیم که سازندگان را در سطح جهانی برای ایجاد کسب‌وکارهای مقیاس‌پذیر و پایدار توانمند می‌سازد.

🧑‍💼 Callstack – Senior React Native Developer – کاملاً از راه دور، PLN 21-32k خالص در B2B، ماهانه

آیا می خواهید روی پرکاربردترین اپلیکیشن های دنیا کار کنید؟ آیا می خواهید فناوری React Native را به طور مشترک ایجاد کنید؟ به تیم Callstack از رهبران React & React Native بپیوندید. برای جزئیات بیشتر وب سایت ما را بررسی کنید. ما مشتاقانه منتظر دیدن درخواست شما هستیم – آنچه را که دارید به ما نشان دهید!

🧑‍💼 G2i – 100% Remote React Native Jobs

ما چندین نقش برای توسعه دهندگانی داریم که بر روی React Native متمرکز شده اند! پرداخت ~ 160 هزار به علاوه 10٪ پاداش است. شما باید تجربه تولید با RN داشته باشید و در ایالات متحده مستقر باشید. DM @gabe_g2i برای کسب اطلاعات بیشتر و ذکر این هفته در React را فراموش نکنید.

💡 چگونه پیشنهاد را منتشر کنیم؟

🔀 دیگر

🤭 سرگرمی

می بینمت! 👋