فهرست مندرجات[پنهان شدن][نمایش]
مفهوم میکرو فرانتاند، میکروسرویسها را برای توسعه فرانتاند به کار میبرد.
ایده این است که برنامه یا وبسایت را به قطعات کوچکتر و مستقلتر تقسیم کنیم که سپس در طول زمان اجرا به هم متصل میشوند، نه ایجاد آنها بهعنوان یکپارچه منسجم.
این روش شما را قادر می سازد تا سایر اجزای برنامه را با استفاده از فناوری های دیگر و با تیم های مستقل ایجاد کنید.
ایده این است که با تقسیم بندی توسعه به این روش، هزینه های تعمیر و نگهداری مربوط به یک یکپارچه معمولی را کاهش دهیم.
با اجازه دادن به آنها برای تمرکز بر روی یک منطقه خاص از برنامه به عنوان یک تیم منسجم، اشکال جدیدی از همکاری بین توسعه دهندگان باطن و فرانت اند را نیز ممکن می سازد.
به عنوان مثال، ممکن است تیمی داشته باشید که به تنهایی مسئول قابلیت جستجو یا جنبه دیگری از یک محصول کلیدی است که برای یک تجارت بسیار مهم است.
به لطف فدراسیون ماژول، شما عملکرد کافی برای مدیریت گردش کار دارید پیشانی میکرو دستورات رویکرد
این پست نگاهی عمیق به معماری فدراسیون ماژول و همچنین ویژگیهای اصلی و الگوهای کاربردی آن خواهد داشت.
بنابراین ، چیست فدراسیون ماژول?
طراحی فدراسیون ماژول جاوا اسکریپت از قطعات استفاده مجدد در بسیاری از برنامه ها استفاده می کند.
این اصطلاح نسبتاً ابتدایی است، اما من به سادگی آن را به نظر میرسانم که آرام به نظر برسد.
همانطور که همه ما با به اشتراک گذاری کامپوننت ها در یک برنامه React آشنا هستیم، Module Federation به طور موثر همان هدف را در عمل انجام می دهد، با این تفاوت که به صورت پویا ماژول های برنامه را برای مصرف سایر برنامه ها در معرض دید قرار می دهد.
فدراسیون ماژول به دنبال غلبه بر مشکل به اشتراک گذاری ماژول در یک سیستم توزیع شده با ارائه آن عناصر کلیدی مشترک به صورت ماکرو یا خرد به صورت دلخواه است.
این کار با حذف آنها از برنامه های شما و گردش کار ساخت انجام می شود.
چرا فدراسیون ماژول؟
در اینجا عواملی وجود دارد که فدراسیون ماژول می تواند به راحتی از عهده آنها برآید:
- اکسترنال ها و DLL ها (کتابخانه های پیوند پویا) همه چیزهایی بودند که گهگاه برای اشتراک گذاری عملکرد بین برنامه ها داشتیم. همه اینها به اشتراک گذاری کد مقیاس را بسیار چالش برانگیز کرده است.
- NPM کند است.
- وقتی دو برنامه جداگانه کدهای مهم را به اشتراک می گذارند، باید پویا و انعطاف پذیر باشند.
برای اینکه برنامههای مستقل کاملاً در مخزن خود باشند، به طور جداگانه مستقر شوند و به عنوان SPA مستقل خود عمل کنند، فدراسیون ماژول ایجاد شد.
اجزای اصلی فدراسیون ماژول
قبل از غواصی عمیق تر، بحث مختصر درباره چند مفهوم جدید که فدراسیون ماژول به ارمغان می آورد، مهم است.
- میزبان: هنگامی که یک صفحه بارگذاری می شود، ساخت یا ماژول اولیه اولیه شده میزبان نامیده می شود. یک ارائه دهنده را می توان به عنوان یک میزبان در نظر گرفت.
- Remote: ریموت ساختار متفاوتی است که از بخشی از میزبان استفاده می کند. از آنها به عنوان مشتری نیز یاد می شود.
- میزبان دو طرفه: یک ساخت وب پک که هم به عنوان یک کنترل از راه دور که سایر میزبان ها مصرف می کنند و هم به عنوان میزبانی که از راه دور استفاده می کند عمل می کند.
- Federation Vendor: اشتراکگذاری زمان اجرا مشترک وابستگیهای ماژول npm را برای یک میزبان یا از راه دور، بدون توجه به مکانی که از آن بارگیری میشوند، فعال میکند. یکی از مشکلات عمده عملکرد میکرو فرانتاندها از این طریق حل میشود.
الگوهای برنامه فدرال
سیستم طراحی همیشه سبز
یکی از اساسیترین اشکال برنامههای کاربردی یکپارچه، «کنترل از راه دور همیشه سبز» است که یک کنترل از راه دور مشترک مانند «سیستم طراحی» یا «کتابخانه مؤلفه» است که به طور مستقل برای همه کاربران توزیع و بهروزرسانی میشود.
بدون اینکه هر تیم برنامه نیاز به صرف زمان برای بازبینی داشته باشد، این ممکن است برای اطمینان از اینکه همه سایتهای آنلاین به جدیدترین هویت شرکتی پایبند هستند مفید باشد.
به منظور طراحی و پیاده سازی محدودیت ها و رویه های لازم برای تضمین به روز رسانی های ایمن و مداوم، این مکان ممکن است مکانی مفید برای شروع کسب و کارها در هنگام در نظر گرفتن معماری برنامه های کاربردی فدرال باشد.
در زیر موارد استفاده وجود دارد که در آن ریموتهای اشتراکگذاری شده مستقل ممکن است مناسب باشند:
- سیستم های طراحی
- پوسته های کاربردی
- کتابخانه های مؤلفه
- مصرف کنندگان
- جعبه ابزار مشترک
- مدل های توزیع جایگزین برای ویجت های مورد استفاده داخلی یا خارجی
به اشتراک گذاری ماژول چند SPA
از ویژگیهای قبلاً صادر شده، مانند مؤلفهها، در برنامههای مختلف تک صفحهای مستقل استفاده کنید. مزایا عبارتند از:
- مصرف کنندگان به روز رسانی های خودکار را دریافت می کنند
- تخصص دامنه در تیمی که مسئولیت آن را بر عهده دارد باقی می ماند.
- روند استقرار را ساده می کند زیرا انتشار ماژول جداگانه لازم نیست.
فدراسیون پوسته محور
فدراسیون پوسته محور شامل:
- هنگام ایجاد یک نسخه محصول جدید، تیم محصول منتظر نمی ماند تا تیم Checkout کار خود را تکمیل کند.
- هنگام تعویض ریموت، صفحه بارگیری مجدد وجود ندارد.
- در صورت لزوم، شل بارگیری از راه دور آهسته و مسیریابی (سطح بالا) را ارائه می دهد.
- مسیریابی از راه دور از طریق فدراسیون فروشنده امکان پذیر است، که امکان استفاده مجدد از بسته های پرکاربرد npm را فراهم می کند.
- شل چارچوب و سایر وابستگی های رایج را ارائه می دهد که توسط ریموت های لود شده تنبل استفاده مجدد می شوند.
فدراسیون چند پوسته
شبیه به فدراسیون پوسته محور که در بالا توضیح داده شد، اما از پوسته های مختلف استفاده می شود.
آن شامل:
- تعدادی پوسته
- برچسب زدن سفید
- همه ریموت ها توسط Shell B مورد نیاز نیستند یا پیاده سازی مستقلی ندارند.
ویژگی های اصلی فدراسیون ماژول
عملکرد وب عالی
مشکل ترکیب معمولی ماژول NPM این است که با افزایش تعداد وابستگان، اندازه برنامه به طور کلی افزایش می یابد.
به منظور جلوگیری از بارگیری باندل ها هنگام بارگیری برنامه شما و تنها در صورت لزوم بارگیری آنها، فدراسیون ماژول این امکان را به شما ارائه می دهد که باندل ها را با تنبلی بارگذاری کنید.
این از نیاز به دانلود ماژول ها قبل از نیاز واقعی جلوگیری می کند که سرعت سایت را بهبود می بخشد.
توسعه موثر
هر پروژه را می توان به صورت مجزا تولید و تحویل داد و می تواند توسط تیم های مختلف انجام شود زیرا فدراسیون ماژول شما را تشویق می کند تا برنامه خود را در پروژه های مجزا سازماندهی کنید تا بتوانید آنها را به طور جداگانه (و بنابراین به صورت موازی) بسازید و اجرا کنید.
توانایی خوددرمانی و افزونگی
وابستگی های مشترک به فدراسیون ماژول اجازه می دهد تا تمام وابستگی های برنامه شما را در یک مکان پیگیری کند.
به این ترتیب، حتی زمانی که یک برنامه وابستگی را اعلام نمی کند یا زمانی که مشکلات شبکه وجود دارد، همچنان می داند به چه چیزی نیاز دارد و می تواند آن را در صورت نیاز دانلود کند.
مدیریت موثر وابستگی های رایج
علاوه بر این، Module Federation مدیریت وابستگی برتر را ارائه می دهد، به طور موثری نیازهای فروشنده و شخص ثالث را حل می کند به طوری که برنامه شما هرگز بیش از یک نسخه از یک کتابخانه را بارگیری نمی کند.
به جای نیاز به استقرار مجدد مصرف کنندگان، کد مستقل را مستقر کنید.
توسعه دهنده علاقه زیادی به داشتن قابلیت همیشه سبز دارد. هنگامی که عملکرد وابسته در معرض تغییر کرد، دیگر نیازی به نصب مجدد مصرف کنندگان نخواهد بود.
باید اعتراف کنم که این ویژگی به خودی خود یک ویژگی بسیار قوی است که برای جلوگیری از نتایج غیر منتظره نیاز به بررسی دقیق دارد.
هنگام اجرا، کد را از ساختهای دیگر وارد کنید.
هنگام اتخاذ مدل بسته NPM، ممکن است برنامههایی را در نظر بگیریم که به جای اشتراکگذاری کد و فکر کردن به «کتابخانه»، از Federation Module مشابه APIها استفاده میکنند.
به همان ترتیبی که میتوانند عملکردی از برنامههای دیگر دریافت کنند، برنامههای کاربردی وب اکنون میتوانند عملکرد را برای سایر برنامهها فراهم کنند.
تجربه توسعهدهنده پیشرفته در عین حفظ تجربه مشتری
هر توسعه دهنده جاوا اسکریپت با Module Federation کاملاً راحت خواهد بود زیرا این افزونه Webpack است که از Webpack نسخه 5 قابل دسترسی است.
اگر کمی به آن فکر کنیم، در واقع بسیار قوی و جذاب است.
با استفاده از لودرهای وب پک شخص ثالث، تمام اجزای آن را در نظر بگیرید صفحه وب بستهها، از جمله اسکریپتها، داراییها، سبکها، تصاویر، نشانهگذاریها و موارد دیگر.
با استفاده از Module Federation، همه اینها را می توان به اشتراک گذاشت و فدرال کرد.
فرانتاندهای خرد به شکلی یکپارچه عمل میکنند.
اضافه کردن قابلیت های مشترک به برنامه شما بسیار آسان است. فقط بسته نرمال را وارد کنید یا از بارگذاری همزمان استفاده کنید.
روش دیگر، بارگذاری ناهمزمان را می توان تنها برای بارگذاری وابستگی ها در صورت لزوم با استفاده از بارگذاری تنبل استفاده کرد.
نتیجه
در این پست، ما Module Federation را به عنوان یک انتخاب فوق العاده برای توسعه اپلیکیشن micro-frontend شما مورد بحث قرار داده ایم.
اجازه دادن به برنامهها برای تبادل و مصرف عملکرد در زمان اجرا، با امکان دادن به تیمهای مختلف برای کار بر روی برنامههای مستقل، مقیاسپذیری را تشویق میکند.
هنگامی که عملکرد رایج تغییر می کند، نیازی به طراحی و استقرار مصرف کنندگان خود نخواهید داشت زیرا از عملکرد همیشه سبز پشتیبانی می کند.
برنامه شما پس از راه اندازی مانند یک مونولیت عمل می کند که فوق العاده است.
وابستگی های قابل اشتراک گذاری برای کاهش اندازه برنامه ها استفاده می شود. از آنجایی که بسیاری از توسعه دهندگان از قبل با محیط Webpack آشنا هستند، تجربه توسعه دهندگان عالی است.
پاسخ دهید