زمان تقسیم یک جزء به چند جزء
آیا می دانستید که می توانید هر برنامه React را به صورت یک React بنویسید
جزء؟ مطلقاً هیچ چیز از نظر فنی مانع از قرار دادن React نمی شود
کل برنامه شما در یک جزء بزرگ. ویژگی شما بزرگ خواهد بود.
تعداد زیادی قلاب و عوارض جانبی وجود خواهد داشت، اما کاملاً ممکن است.
با این حال، اگر این را امتحان کنید، با چند مشکل مواجه می شوید:
- عملکرد احتمالاً آسیب خواهد دید: هر تغییر حالت منجر به رندر مجدد می شود
از کل برنامه - به اشتراک گذاری/استفاده مجدد از کد کار آسانی نیست. حداقل اگر شما یک
کلاس کامپوننت که اگر می خواهید استفاده کنید ممکن است لازم باشد آن را بسازید
componentDidCatchبرای رسیدگی به خطاهای زمان اجرا اگر اجازه استفاده داشتید
react-error-boundaryبنابراین شما می توانید از قلاب ها استفاده کنید و سپس آن را انجام دهید
به طور قابل توجهی راحت تر اما … من پرت می شوم … - ایالت یک چالش خواهد بود: دانستن کدام بخش از ایالت و مدیریت رویدادها
شما فهمیدید که کدام قسمت های JSX باعث می شود سر شما درد بگیرد و منجر به برخی از آنها شود
تشخیص خطاها سخت است 🐜 (این یکی از مزایای تقسیم کردن است
نگرانی). - آزمایش 100٪ یکپارچه خواهد بود:
لزوما چیز بدی نیست، اما می شود
تست لبه ها و جدا نگه داشتن اشیا از قطعات بسیار دشوار است
که سعی در آزمایش آن دارید، بنابراین از آزمایش بیش از حد رنج خواهید برد
(که یک اشتباه رایج در تست E2E است). - همکاری در پایگاه کد با چندین مهندس فقط مناسب خواهد بود
وحشتناک آیا می توانید اختلافات git و ادغام درگیری ها را تصور کنید؟! - استفاده از کتابخانه های مؤلفه شخص ثالث غیرممکن خواهد بود؟ اگر
ما همه چیز را به صورت کتابخانه های شخص ثالث تک جزیی می نویسیم
شانس با این گل! و حتی اگر اجازه استفاده از اجزای شخص ثالث را بدهیم،
HOC به عنوان یک واکنش-احساس چطور؟ مجاز نیست!
(همچنین باید استفاده کنیدcssپشتیبانی می کند
به هر حال 😉). - محصور کردن انتزاعات / APIهای ضروری در یک جزء اعلامی تر
API نیز حل نخواهد شد، به این معنی که API ضروری حل خواهد شد
در طول چرخه زندگی قلابهای یک جزء غولپیکر ما نقطهگذاری شده است
دنبال کردن کد سخت تر است (باز هم، مگر اینکه از قلاب استفاده کنید، در این صورتمیتوانید قلابهای مرتبط را با هم گروهبندی کنید تا مدیریت آن آسانتر شود، اما
هنوز کمی کابوس است).
اینها دلایلی است که ما کامپوننت های سفارشی را می نویسیم. به ما اجازه می دهد تصمیم بگیریم
این مشکلات
مدتی است در مورد AMA خود سوالی دارم:
بهترین راه ها/الگوها برای تقسیم برنامه شما به اجزا.
و این پاسخ من است: “وقتی یکی از مشکلات بالا را تجربه می کنید، همین است
هنگامی که کامپوننت خود را به چندین جزء کوچکتر تقسیم می کنید. نه قبل.”
شکستن یک جزء واحد به اجزای متعدد، چیزی است که به آن می گویند
“انتزاع”. انتزاع عالی است، اما
هر انتزاعی بهایی دارد و شما باید باشید
قبل از شروع غواصی از این هزینه و مزایا آگاه باشید
تکرار بسیار ارزان تر از انتزاع اشتباه است.
– سندی متز
بنابراین من اهمیتی نمیدهم که JSX که در تابع جزء من برمیگردانم واقعا طولانی شود.
به یاد داشته باشید که JSX فقط مجموعه ای از عبارات جاوا اسکریپت است که استفاده می کند
APIهای اعلامی ارائه شده توسط کامپوننت ها. با کد مشکل زیادی وجود ندارد
و حفظ آن کد به همان شکلی که هست بسیار ساده تر از فرار از آن است
در مجموعه ای از اجزای کوچکتر قرار دهید و شروع کنید
حفاری تکیه گاه در همه جا.
نتیجه گیری
بنابراین با خیال راحت اجزای خود را به قطعات کوچکتر تقسیم کنید، اما نترسید
بر روی یک جزء رو به افزایش تا زمانی که شروع به تجربه مشکلات واقعی کنید. این یک راه است
نگه داشتن آن تا زمانی که شکسته شود آسان تر از این است که آن را زودرس نگه دارید
انتزاع موفق باشید!



