بهترین فریم ورک های جاوااسکریپت (سری اول)

سید علی اندرزگو 70 بازدید

طبق بررسی توسعه دهنده stackoverflow در سال 2020  جاوااسکریپت رایج ترین زبان در طی 8 سال اخیر بوده است که با 67.7٪ انتخاب کاربران در صدر است. دلیل اصلی محبوبیت جاوااسکریپت تنوع آن است و می تواند برای پیشرفت در زمینه های سمت کاربر و سمت سرور و همچنین برای تست وب سایت ها یا برنامه های وب استفاده شود. در این مقاله بهترین فریم ورک های JavaScript را معرفی خواهیم کرد.

در حالی که googling «فریم ورکJavaScript» را انجام می دهید، با framework های مختلف JavaScript روبرو می شوید که هرکدام مزایا و کاربرد خاص خود را دارند. انتخاب های زیادی از نظر ظاهر، توسعه پس زمینه یا حتی آزمایش کردن وجود دارد و همین امر انتخاب فریم ورک مناسب را برای نیازهای شما دشوار می سازد.

محتوای مقاله

  • Front End JavaScript framework
    • React JS
    • Vue Js
    • Angular JS
    • Ember JS
    • Preact JS
    • Svelte JS
  • Back End JavaScript framework
    • Express JS
    • Next JS
    • Gatsby JS
    • Nuxt JS
  • JavaScript Testing framework
    • Jest
    • Mocha
    • Jasmine


جاوا اسکریپت تقریباً 2 دهه است که به طور گسترده برای توسعه فرانت اند استفاده می شود. فریم ورک های محبوبی مانند React ،Vue و Angular لژیون عظیمی از طرفداران برای خود کسب کرده اند، اخیرا معدود رقبایی در حال رساندن خود به این 3 فریم ورک محبوب هستند. در ابتدا 6 فریم ورک برتر front-end را معرفی می کنیم.

Front End JavaScript framework

1 . React.js

مقام اول بهترین فریم ورک های جاوا اسکریپت برای رتبه بندی در سال 2020 در رده سمت کاربر به React.js تعلق دارد. React.js یک کتابخانه منبع باز JavaScript است (البته یک فریم ورک تمام عیار نیست) که توسط تیمی از توسعه دهندگان فیس بوک به رهبری جردن واک در سال 2011 ایجاد شد و در ژوئن 2013 تبدیل به منبع باز شد. نمونه اولیه آن لقب گرفت " FaxJS »و اولین بار در Newsfeed در فیس بوک آزمایش شد. React را می توان یکی از بزرگترین مخربان تأثیرگذار در دامنه توسعه وب دانست که دستیابی به موفقیت واقعی در شکل دهی به برنامه های وب که امروزه شاهد آن هستیم.



React یک سبک برنامه نویسی مبتنی بر مؤلفه، کاربردی و اعلامی را برای ایجاد رابط های کاربر تعاملی برای برنامه های وب عمدتا تک صفحه ای ارائه داد. React با استفاده از "DOM مجازی" که تنها اجزای تغییر یافته را به جای ارائه کل صفحه ارائه می دهد، ارائه سریع و چشمگیر را ارائه می دهد. یکی دیگر از ویژگی های مهم React استفاده از ترکیب ساده تر JSX به جای JavaScript است.

اگرچه React دارای منحنی یادگیری سخت تری نسبت به بقیه فریم ورک های جاوا اسکریپت در این لیست است، اما React توسط یک جامعه توسعه دهنده بزرگ، منابع فراوان یادگیری و صنعت گسترده در هر گوشه دنیا پشتیبانی می شود. React به طور مداوم نمودارهای محبوبیت بالایی در بین فریم ورک های JavaScript دارد، خواه Stack overflow Survey Developer یا State OF JS Survey باشد. React به طور مداوم تاج را به عنوان قسمت مورد علاقه خود در چارچوب جاوا اسکریپت به دست آورده‌است. شرکت ها و مارک های جهانی بزرگی مانند Airbnb ،Facebook ،Instagram ،Netflix ،Twitter،WhatsApp و بسیاری دیگر با استفاده از React ساخته شده اند. اینکه تصور کنیم React.js یکی از بهترین framework های جاوا اسکریپت است اشتباه نکرده ایم.


آمار کاربران React در سال 2020

  • React به عنوان فریم ورک شماره یک JavaScript فرانت اند در نظرسنجی State Of JS 2019 از توسعه دهندگان JavaScript در سراسر جهان برای چهارمین سال متوالی انتخاب شد! React از سال 2016 جلوتر از رقیبان اصلیخود یعنی Vue و Angular به عنوان بهترین فریم ورک جاوا اسکریپت در رتبه اول قرار گرفت
  • در حال حاضر 71.7٪ کاربران از devs JavaScript  از React استفاده می كنند در حالی كه طبق نظر سنجی State Of JS 2019  دوازده درصد دیگر نیز در آینده علاقه مندندیاد که آن را بگیرند. این رقم پرش تقریباً 8٪ نسبت به سال گذشته را نشان می دهد که در آن رقم فعال کاربر 64٪ بود
  • در بررسی برنامه نویسان Stack Overflow در سال 2020 ، React با 35.9٪ آرا در پشت جی کوئری در رتبه دوم چارچوب وب قرار گرفت که به طور پیوسته سهم خود را برای واکنش نشان می داد
  • تقریباً 1.45 میلیون به 1.6 میلیون وب سایت (زنده و تاریخی) با React acc ساخته شده است. آمارهای Wappalyzer و BuiltWith از ژوئن سال 2020
  • نسخه فعلی - 16.13.1.
  • Github - 150k Stars و 1،388 مشارکت کننده از ژوئن سال 2020
  • NPM - به طور متوسط ​​از ژوئن سال 2020 به طور متوسط ​​در هر هفته از 7.5-8.5 میلیون بارگیری در هفته بارگیری کنید


مزایای استفاده از React

  1. مؤلفه های قابل استفاده مجدد - رویکرد مبتنی بر مؤلفه React به توسعه دهندگان کمک می کند تا بدون شکستن عرق به جای اینکه آنها را از ابتدا رمزگذاری کنند، از وارد کردن یا استفاده مجدد از اجزای UI استفاده کنند.
  2. ادغام آسان - React اجازه می دهد تا یکپارچه سازی آسان با سایر چارچوب های جلویی و پشتی مانند چارچوب محبوب PHP Laravel برای پشت سر هم بدون دردسر کار کنید.
  3. یک جریان داده جهت گیری - یکی از بزرگترین تفاوتهای اساسی بین React و زاویه ای 1 این بود که React بر پایه معماری جریان داده یک جهت رو به پایین و نه یک اتصال داده دو طرفه اتخاذ شده توسط Angular بود. این تضمین می کند که یک عنصر کودک نمی تواند پدر و مادر را در ایجاد کد پایدارتر و در معرض خطا قرار دهد.
  4. نحو ساده - React از افزونه JSX JavaScript به جای JavaScript معمول استفاده می کند که یک HTML مانند نحو است که خواندن، درک و حفظ کد را آسان تر می کند.
  5. Virtual DOM - React یک نمایه مجازی یا یک نسخه از DOM به نام Virtual DOM یا vDOM ایجاد می کند. React ،DOM مجازی را با DOM واقعی مقایسه می کند و تنها اجزایی را تغییر می دهد که به جای ارائه کل صفحه تغییر کرده اند. این کلید عملکرد سریع چشمگیر React است.
  6.  جستجوگرها - پس از بسیاری از پیشرفت ها ، React یکی از مهمترین فریم ورک های دوستانه در زمینه SEO است که خزیدن صفحه را تسهیل می کند. چارچوب های سنتی JavaScript که به صورت پویا محتوا را ارائه می دهند به دلیل عملکرد ضعیف سئو و ناسازگاری با خزندگان موتور جستجو بدنام بودند.
  7. بهبود مستمر - React در حالت تکامل و بهبود مداوم است و ویژگی های جدید جدیدی همچون هوک ها، فیبرها، حالت همزمان، سیستم تعلیق و غیره را برای کاهش کد boilerplate، بهبود همزمانی و رندر سریع و افزایش عملکرد باعث می شود تا آن را به عنوان بهترین جلو جلوی یک مدعی قوی قرار دهد. چارچوب جاوا اسکریپت.
  8. پشتیبانی جامعه غنی - React توسط یک انجمن توسعه دهنده گسترده با تقریباً 1.6 کیلومتر مشارکت در Github و مجموعه گسترده ای از منابع یادگیری، آموزش ها و راهنماهای راهنما که به راحتی در دسترس همه قرار دارند پشتیبانی می شود. همچنین فراموش نکنید که React توسط یکی از بزرگترین و قدرتمندترین شرکت جهان پشتیبانی می شود - Facebook.


معایب استفاده از React

  1. اگرچه JSX یک اصطلاح ساده تر است که خواندن و درک آن آسان تری دارد، اما ممکن است مانعی برای یادگیری اضافی برای توسعه دهندگان جدید به وجود آورد.
  2. بسیاری از توسعه دهندگان ممکن است احساس کنند که React نسبت به اصلی ترین رقیب خود (Vue ،js) یا هر فریم ورک JavaScript سمت کاربر دیگری دارای منحنی یادگیری سخت تری است
  3. React غالباً با شکایات مربوط به اسناد ضعیف روبرو است که نمی تواند با انتشار نسخه های جدید و ویژگی های مجبور به توسعه دهندگان روبرو شود.
  4. React فقط با View Layer Model MVC سر و کار دارد و چاره ای جز اعتماد به فن آوری های دیگر برای مقابله با Model و Controller Layers ندارد.
  5. React با سرعتی بسیار سریع در حال تکامل و تغییر است و نیاز به توسعه دهندگان برای بازی گرفتن و مجدد خود را دارد که مقابله با آنها بسیار ناچیز و دشوار است. توسعه دهندگان غالباً خود را در چرخه یادگیری مداوم گیر می آورند که باعث می شود دانش قبلی خود بی فایده یا ناقص باشد.


وب سایت های برتر ساخته شده با React

Airbnb ،Asana ،BBC ،Cloudflare ،Codecademy ،Dropbox ،Facebook ،Github، Imgur ،Instagram، Medium، Netflix، OkCupid، Paypal، Periscope، Pinterest، Product Hunt، Reddit، Salesforce ،Scribd، Shopify ،Slack، Snapchat، Squarespace ،Tesla، Typeform، توییتر، Uber ،Udemy ،WhatsApp ،Zendesk.

2 . Vue.js

مقام دوم لیست ما به Vue.js.تعلق دارد. Vue.js یک فریم ورک متن باز JavaScript با سبک سبک منبع باز است که برای ساخت رابط کاربری خلاق و برنامه های وب با صفحه یک کارایی بالا با حداقل تلاش استفاده می شود.


Vue نخستین بار در سال 2014 توسط Evan You یک توسعه دهنده کار برای Google که از Angular الهام گرفته بود برای ارائه یک جایگزین ساده سبک و کارآمد در قالب Vue.js. راه اندازی شد. اگرچه Vue بیشتر ویژگی های خود را از React و Angular پذیرفته است، اما در این ویژگی ها پیشرفت های اساسی ایجاد کرده است تا یک فریم ورک بهتر، آسان و ایمن را ارائه دهد. بزرگترین نمونه این رویکرد این است که Vue داده ای دو طرفه را فراهم می کند، همانطور که در React دیده می شود در Angular و ‘Virtual DOM’.

به همین ترتیب و انعطاف پذیری بالایی را ارائه می دهد - نه تنها می تواند به عنوان یک فریم ورک تمام عیار پایان به پایان برسد مانند Angular بلکه یک لایه دید با مدیریت حالت مانند React نیز عمل کند. بنابراین ، اصلی ترین مزیت اصلی Vue، ماهیت ساده تر، بدون عارضه، نامحدود و مترقی آن است که با نیازهای توسعه دهنده سازگار است. Vue در طی 2 سال گذشته شاهد انفجار گسترده ای از محبوبیت خود بوده است، و Angular را به عنوان رقیب اصلی برای به چالش کشیدن سلطه React به عنوان بهترین فریم ورک جلوی JavaScript در نظر گرفته است. یکی از بزرگترین شرکت های جهان مانند Adobe ،Apple ،BMW ،Louis Vuitton ،Nintendo از Vue استفاده می کند.


آمار استفاده از Vue 2020

  • Vue در رتبه دوم JavaScript Framework رتبه 2 در نظرسنجی State Of JS 2019 توسط برنامه نویسان برای دومین سال متوالی ضرب و شتم Angular قرار گرفت. Vue در سال 2017 در رتبه 3 و 5 در سال 2016 قرار گرفت.
  • 40.5٪ از Devs JavaScript در حال حاضر از Vue استفاده می كنند و تعهد می كنند تا از آن استفاده كنند ، در حالی كه 34.5٪ علاقه زیادی به استفاده از آن در آینده (2٪ بالاتر از Svelte) طبق نظرسنجی State of JS 2019 نشان داده اند. این افزایش چشمگیر در حدود 12٪ در کاربران فعلی نسبت به سال گذشته را نشان می دهد ، جایی که این رقم 28.8٪ بود.
  • در بررسی برنامه نویسان Stack Overflow از 2020 ، Vue در رتبه هفتم چارچوب وب محبوب ترین به طور کلی و سومین فریم ورک محبوب JavaScript جلویی در پشت React و Angular قرار گرفت.
  • تقریباً وب سایت های 427k تا 693k (زنده و تاریخی) با Vue acc ساخته شده اند. به آمار Wappalyzer و BuiltWith از ژوئن سال 2020.
  • نسخه فعلی - 2.6.11
  • گیتوب - 166k Stars و 293 مشارکت کننده از ژوئن سال 2020.
  • NPM - Vue از ژوئن 2020 تا پیش از Angular ، 1.63 میلیون بارگیری بارگیری در هفته در NPM ثبت کرد.


مزایای استفاده از Vue

  • سادگی - بهترین مزیت Vue.js سادگی حیرت انگیز آن است. هر توسعه دهنده واقعی می تواند Vue را براحتی انتخاب وبا آن کار کند. Structure of Vue ساده است و شما را قادر می سازد تا با نحو کمتر از نوع دیگری کدگذاری کنید. Vue از یک سیستم کامپوننت فایل استفاده می کند ، بدین معنی که برای هر مؤلفه داده شده ، HTML ، CSS و JavaScript همه در یک پرونده واحد قرار دارند.
  • ساخته شده در MVC - Vue دارای یک MVC داخلی است که امکان تنظیم سریع و آسان بر خلاف React را فراهم می کند.
  • آسان برای یادگیری - Vue نیازی به یادگیری JSX یا typescript مانند موارد React یا Angular ندارد. Vue از الگوهای آسان HTML استفاده می کند که باعث افزایش پیچیدگی کد نمی شود.
  • اندازه کوچک - یکی دیگر از مزیت های مهم Vue ، اندازه سبک شگفت آور آن با توجه به قدرت چشمگیر آن است. نسخه gzipped از Vue به اندازه 18-20 کیلوبایت وزن دارد، بسیار سبک تر از رقبای بزرگ نفخ آن مانند React یا Angular.
  • مستندات - بهترین راه حل مستند در بین سایر چارچوبهای موجود در این لیست برکت داده شده است. هر مبتدی با دانش پایه JavaScript باید به لطف مستندات کاملاً نوشته شده و کامل ، با Vue در دو ساعت کار کند و راه اندازی شود.
  • ادغام - Vue نه تنها می تواند برای ایجاد برنامه های کاربردی از ابتدا با چهره ای سریع و چشمگیر استفاده شود ، بلکه می تواند بدون ایجاد مشکلی در ایجاد اجزای جدید ، در برنامه های وب موجود یکپارچه شود.


معایب استفاده از Vue

  1. انجمن کوچک مشارکت کنندگان - Vue.js از پشتیبانی غول هایی مانند فیس بوک یا گوگل مانند موارد React یا Angular لذت نمی برد. اما Vue واقعاً موفق به ایجاد جامعه پشتیبانان شده است. در github ، Vue دارای 291 مشارکت کننده است که مناسب و معقول است اما هنوز هم در هیچ کجای نزدیک به نوع پشتیبانی React با همکاران 1.6k لذت نمی برد. هنوز هم به اوان و تیمش برای ایجاد موفقیت در یکی از چارچوب قدرتمندترین و دوست داشتنی که جامعه جامعه تاکنون دیده است ، توجه می کنند.
  2.     فرصت های محدود اشتغال در مقایسه با React و Angular - Vue بدون شک در چین و ایالات متحده بسیار محبوب است اما ممکن است در سایر نقاط جهان چنین نباشد. به طور سنتی ، ایالات متحده همیشه پیشرو در پذیرش فناوری جدید است و سایر کشورهای جهان از آن عقب مانده اند. محبوبیت Vue در سایر نقاط جهان مانند ایالات متحده هنوز ذخیره نشده است. این امر می تواند با این واقعیت تأیید شود که از 720k وب سایتهای زنده که اکنون با Vue.js ساخته شده اند ، بیش از 450k فقط در ایالات متحده ثبت شده اند.


وب سایت های برجسته ساخته شده با Vue

9gag، Adobe، Apple Swift UI، Behance، Bilibili، BMW، Chess، Font Awesome، Gitlab، Hack the box، Laravel، Laracasts، Louis Vuitton، Namecheap، Netlify، Netguru، Nintendo، Pluralsight، Pornhub، Shien، Stack overflow ،Trivago Trustpilot ،Upwork ،Wizzair ،Zoom.


3 .Angular.js

مقام سوم در لیست بهترین فریم ورک های جاوا اسکریپت به Angular.js می رود. Angular یک فریم ورک متن باز مبتنی بر متن است که توسط گوگل برای ساخت برنامه های وب تک صفحه ای طراحی شده است. Angular توسط مهندسان گوگل Misko Hevery و Adam Abrons در سال 2010 به نام AngularJS (یا Angular 1) ایجاد شد. AngularJS بسیار مورد تحسین قرار گرفت اما ظهور React آن را به فراموشی سپرد و کاستی های بزرگ آن را آشکار کرد. در نتیجه، AngularJS بازنویسی کاملی را انجام داد و Angular 2 را در سال 2016 منتشر کرد.


AngularJS (Angular 1) از React الهام گرفت و تغییرات زیادی ایجاد کرد که بزرگترین آن ها تغییر از معماری M-V-W (Model-View-What) به معماری مبتنی بر مؤلفه ها مانند React بود. امروز Angular یکی از امن ترین فریم ورک های سمت کاربر JavaScript برای ساختن برنامه های کاربردی در مقیاس سازمانی است. بیش از یک میلیون وب سایت از جمله Google ،Forbes ،IBM ،Microsoft استفاده می کنند.


آمار استفاده انگولار 2020

  • Angular در مقام سوم لیست ما قرار دارد. Angular در سال 2018 با غلبه بر Vue.js به رتبه 3 رسید و روندی که احتمالاً امسال نیز ادامه خواهد داشت.
  • 9/21 درصد از Devs JavaScript نظرسنجی در حال حاضر از Angular استفاده می کنند و 9.7 درصد علاقه مندند که در آینده طبق یادگیری State Of JS 2019 یاد بگیرند و از آن استفاده کنند. این آمار حاکی از آن است که Angular در مقایسه با نظرسنجی سال 2018 با 2٪ کاهش در کاربران فعال ، نبرد با React و Vue را از دست داده است. علاوه بر این ، Angular کمترین نظرسنجی را به خود اختصاص داده است ، 9.7٪ ناچیز که علاقه مند به استفاده در رده های بعدی است، بسیار پشت React  Vue و Svelte.
  • در بررسی برنامه نویسان Stack Overflow در سال 2020، Angular در رتبه هفتم محبوبترین فریم ورک های وب و به طور کلی دومین فریم ورک سمت کاربر JavaScript درست پشت React قرار گرفت.
  • تقریباً 1.1 میلیون (در حال حاضر زندگی می کنند) - 3.6 میلیون وب سایت (زنده و تاریخی) ساخته شده توسط Angular ساخته شده توسط آمار Wappalyzer و BuiltWith از ژوئن سال 2020 گزارش شده است. این رقم بالاترین برای هر چارچوب جاوا اسکریپت جلویی است.
  •  نسخه فعلی - 9.1.0
  • Github - 59.5k Stars و 1.578k Contributors از ژوئن سال 2020
  • NPM - انگولار از ژوئن سال 2020 دانلود گسترده ای را در NPM ثبت کرد در هر هفته 1.62 میلیون، تقریباً مشابه Vue، اما هنوز هم از React بسیار عقب مانده است.


مزایای استفاده از  انگولار

  • معماری مبتنی بر کامپوننت - پس از حفر معماری MVW انگولار 2 و فراتر از آن معماری کاملاً مبتنی بر مؤلفه را اتخاذ کرده اند که قابلیت استفاده مجدد را تسهیل می کند. اجزاء می توانند بارها و بارها در سراسر برنامه استفاده شوند. همچنین قابلیت خواندن کد و سهولت نگهداری را افزایش می دهد.
  • عملکرد سرور - زاویه ای از حافظه پنهان جعبه و چندین ویژگی پشتیبانی می کند تا از عملکرد سریع سرور اطمینان حاصل شود.
  • MVC - Model View Controller در زاویه ای ویژگی های کلیدی مانند اسکوپ و اتصال داده را تعیین می کند. همچنین تضمین می کند UI و منطق برنامه از یکدیگر جدا شده اند.
  • اتصال داده دو طرفه - یکی از ویژگی های مهم Angular اتصال داده های دو طرفه است که پیوندی بین لایه Model و لایه View به گونه ای ایجاد می کند که هرکدام از آنها تغییر دیگری را نشان می دهد. با این حال ، سایر چارچوب های رقیب برای سادگی یک اتصال داده یک طرفه را اتخاذ کرده اند.
  • معامله برای ساخت برنامه های وب مقیاس سازمانی.
  • ادغام های شخص ثالث - Angular مجموعه ای غنی از ادغام های شخص ثالث را برای پیشرفت بیشتر برنامه وب خود ارائه می دهد.
  • دارای پشتیبانی عظیم  - Angular با پشتیبان گرفتن از Google و یک جامعه توسعه دهنده بزرگ که مشارکت کننده های زیادی در GitHub را در خود جای داده است. Angular همچنین دارای اسناد عالی همراه با یک کتابخانه عظیم از منابع و پشتیبانی جامعه است.


معایب استفاده از انگولار

  • typescript - به منظور استفاده از Angular ، شما موظف هستید از Typescript استفاده کنید که مزایای زیادی را ارائه می دهد اما هنوز هم یک چالش بزرگ برای یادگیری برای غلبه بر توسعه دهندگان جدید ایجاد می کند. Typescript یک مانع بزرگ برای ورود است و توضیح می دهد که چرا زاویه ای علیه React و Vue مبارزه کرده است.
  • سنگین و خونریزی - در مقایسه با گزینه های سبک وزن مانند React JS و Vue JS ، زاویه ای بسیار بزرگ و اندازه بزرگ است ، تقریباً نزدیک به 550-600kb که ممکن است برای بیشتر برنامه های کوچک مقیاس مناسب نباشد.
  • Poor SEO - زاویه ای به دلیل مشکلات حاد در دسترس بودن که همراه با خزنده / عنکبوت موتورهای جستجو است ، با سئو مشاجره می کند. اگر SEO اصلی ترین تمرکز شما باشد ، React یک گزینه جایگزین دوستانه تر SEO است.
  • مهاجرت دشوار - حتی اگر اکنون AngularJS (زاویه ای 1) منسوخ شده باشد ، بسیاری از برنامه ها هنوز این نسخه میراث را اجرا می کنند. مهاجرت از Angular 1 به Angular (نسخه فعلی 9) بسیار دردناک و دست و پا گیر است. زاویه ای با چنین سرعتی در حال پیشرفت است ، مهاجرت در بین نسخه های جدید Angular نیز ممکن است گاهی اوقات چالش برانگیز باشد.
  • منحنی یادگیری شیب دار - در مقایسه با React و به خصوص Vue ، Angular دارای یک منحنی یادگیری بسیار شیب دار است که ممکن است یک سناریوی دلهره آور را برای توسعه دهندگان تازه کار ایجاد کند. برای یادگیری زاویه ای، مستلزم شناخت کاملی از MVC است.


وب سایت های برجسته ساخته شده با Angular

Google ، Allegro ، Blender ، Clickup، Clockify، Delta، Deutsche Bank، DoubleClick، Freelancer، Forbes، Guardian، IBM، Instapage، iStock ،JetBlue ،Lego ،Mailerlite، Microsoft Office، Mixer ،Udacity ،Upwork ،Vevo ،Walmart ،Weather WikiWand ،Xbox ،Youtube.

4 . Ember.js

مقام چهارم در لیست بهترین فریم ورک های جاوا اسکریپت سال 2020 تعلق دارد به Ember.js.Ember.js یک فریم ورک متناسب با منبع آزاد JavaScript است که برای ایجاد برنامه های وب یک صفحه ای مقیاس پذیر مقیاس پذیر استفاده می شود. برخلاف سایر چارچوبهایی که تاکنون در مورد آنها بحث کرده ایم ، ember براساس الگوی معماری Model-View-ViewModel (MVVW) است.


Ember در ابتدا یک فریم ورک SproutCore 2.0 بود که توسط خالق آن Yehuda Katz ، یک توسعه دهنده موفق که به عنوان یکی از سازندگان اصلی jQuery شناخته می شود ، به عنوان Ember.js تغییر نام یافت. یكی از مهمترین و مهمترین ویژگیهای Ember ابزار رابط خط فرمان Ember است كه به خودی خود یك نیروگاه بهره وری است.

حتی اگر Ember یکی از چارچوب های جلوی قدیمی جاوا اسکریپت در مقایسه با React ، Vue و Svelte باشد ، باز هم یک مشت پانچ را در اختیار دارد و دارای یک پایگاه کاربر بزرگ با شرکتهای بزرگ مانند - مایکروسافت ، LinkedIn ، Netflix ، Twitch و غیره در بین مشتریان خود است. همراهان قدیمی تر Ember مانند ستون فقرات و پلیمر از بین رفته اند اما Ember به نوعی توانسته است به لطف جامعه ای پرشور ، قلعه خود را نگه دارد.

آمار استفاده از امبر 2020

  • Ember در نظرسنجی State Of JS 2019 در رده چهارچوب جاوا اسکریپت شماره 6 قرار دارد. این کشور پس از اینکه توسط تازه وارد Svelte کنار گذاشته شد ، نسبت به سال گذشته یک مکان کاهش یافته است.
  • 3.6٪ از توسعه دهندگان JavaScript که مورد نظرخواهی قرار گرفته اند ، در حال حاضر از Ember و در آینده ای قابل پیش بینی استفاده می کنند ، در حالی که 14.1٪ در مورد آن چیزی شنیده اند و قصد دارند آن را در جایی از جاده ، طبق نظرسنجی ایالت JS 2019 یاد بگیرند. همانطور که در مقاله سالهای گذشته اظهار داشتم ، اگر به نتایج نظرسنجی از State JS بپردازید ، متاسفانه Ember به تدریج از توسعه دهندگان که در حال دست به دست شدن به بزرگ 3 - React Angular و Vue یا فریم ورک جدید هیجان انگیز مانند Svelte هستند ، نمی افتد. . در سال 2018 ، Ember در گروه کاربر فعال 6.2٪ نظرسنجی کرد که تقریباً در سال 2019 به 3.6٪ کاهش یافته است. با این وجود ، اگر به بارگیری های هفتگی NPM Ember بروید ، موفق شده است یک کاربر کاربر وفادار را کشف و حفظ کنید. Ember طی 2 سال گذشته مرتباً بارگیری 450k-650k داشته است. Ember همچنین خوشحال است که نام های صنعت مانند Apple ، Accenture ، Digital Ocean ، Fitbit ، Godaddy ، Heroku Intercom Twitch و غیره را در بین کاربران خود بنامد که کافی است به شما بگویم که Ember برای ماندن در اینجاست.
  • تقریباً وب سایت های 32k - 36k (در حال حاضر زنده) و 110k (زنده و تاریخی) با آمارهای BuiltWith از ژوئن سال 2020 با Ember ساخته شده اند.
  • نسخه فعلی - 7.19.0
  • Github - 135Stars و 50 مشارکت کننده در Github از ژوئن سال 2020
  • NPM - پکیج Ember-cli-babel از ژوئن سال 2020 نزدیک به 550 بار بارگیری در هفته در NPM را بارگیری می کند.


مزایای استفاده از Ember

  • API - Ember مکانیسم ساده ای برای کار با API ها ارائه می دهد.
  • Convention on Configuration - Ember از فلسفه رویکرد "CoC - Convention on Configuration" پیروی می کند که تضمین می کند در اکثر موارد نیازی به هیچگونه تنظیمات وجود ندارد تا بتوانید مستقیماً به سمت برنامه نویسی و ساختن برنامه وب خود بروید.
  • مستندات و پشتیبانی غنی - Ember همراه با مستندات دقیق به همراه آموزش های کامل و راهنماهای راهنما برای کمک به شما در شروع کار با سهولت کمک می کند.
  • Ember CLI - Ember Command Line Tool تقویت کننده بهره وری است که نه تنها به راه اندازی پروژه های جدید بلکه در ایجاد قطعات و کنترل کننده ها با استفاده از تولید خودکار کمک می کند. Ember CLI همچنین به نصب وابستگی های شخص ثالث کمک می کند.
  • Inspector Tool - Ember دارای یک برنامه توسعه ابزار Inspector برای Chrome و Firefox است که به نظارت و ویرایش برنامه ها در زمان واقعی کمک می کند.
  • پشتیبانی از داده های دو طرفه شبیه به Angular.
  • سازگاری با نسخه های قبلی


معایب استفاده از Ember

  • Steep Learning Curve - ممکن است توسعه دهندگان جدید Ember را در مقایسه با Vue یا React بسیار چالش برانگیز بدانند.
  • Ember برای کاربردهای پیچیده در مقیاس بزرگ مناسب تر است و ممکن است برای برنامه های ساده در مقیاس کوچک بسیار حجیم و سنگین باشد.
  • رکود در محبوبیت، Ember نتوانست نقطه ای از نظرسنجی توسعهدهندگان Stackoverflow 2020 پیدا کند و فقط می تواند 3.6٪ ضعیف را در گروه کاربران فعال در State Of JS 2019 Survey ثبت کند. اگر این روند ادامه یابد، ممکن است Ember تا پایان سال 2020 توسط Svelte.js پیشی بگیرد.


وب سایت های برجسته ساخته شده با Ember

Crowdstrike، Ghost، GroupOn، Heroku، Intercom، LinkedIn، Microsoft، Netflix ،Skylight ،Square ،TED، Twitch، Yahoo ،Zendesk.


5 . Preact.js

رتبه پنجم در این لیست به Preact.js تعلق دارد. Preact.js یک کتابخانه سبک ، سریع و با کارایی بالا (نه یک فریم ورک کامل) جایگزین React است. Preact صرفاً 3 کیلوبایت اندازه و در عین حال تمام عملکردهای لازم React را به شما می دهد. Preact توسط جیسون میلر  مهندس ارشد برنامه نویسی در گوگل ایجاد شد و می تواند به عنوان زیر مجموعه ای از React از بین برود که برخی از ویژگی های آن را برطرف کند.


Preact.js با همان اصل اصلی رویکرد React - Component based with Virtual Dom ساخته شده است در حالی که کاملاً با React سازگار است. حتی می تواند از بسته های React استفاده کند بدون اینکه به سرعت ، کارایی و اندازه لاغر آسیب برساند. در مواردی که پتانسیل کامل React ضروری نباشد ، اکثر توسعه دهندگان حتی از React در حین توسعه استفاده می کنند و برای تولید به Preact تغییر می دهند. بسیاری از شرکتهای بزرگ مانند Tencent ، Uber و Lyft از Preact استفاده می کنند.

آمار استفاده از عمل 2020

  • Preact در جایگاه چهارم جاوا اسکریپت رتبه دوم فریم ورک جاوا اسکریپت را برای دومین سال متوالی در نظرسنجی State Of JS 2019 کسب کرد. پراکت برتری خود را نسبت به امبر و پلیمر گسترش داده است.
  •  9.5٪ از devs های JavaScript نظرسنجی شده از Preact قبل استفاده كرده اند و قصد دارند با آن چسبیده باشند در حالی كه 25.6٪ علاقه به یادگیری و استفاده از آن را در آینده طبق بررسی های State Of JS 2019 نشان داده اند. اگرچه Preact طی دو سال اخیر رشدی سالم در کاربران فعال و محبوبیت خود را نشان داده است ، اما Svelte می تواند تا پایان سال 2020 از آن پیشی بگیرد.
  • تقریباً وب سایت های 21.5k (در حال حاضر زنده) و 65k (زنده و تاریخی) با پیش ساخته توسط آمار BuiltWith / Wappalyzer از ژوئن سال 2020 ساخته شده اند.
  • نسخه فعلی - 10.3.4
  • Github - 25.7k Stars ، 1.4kForks ، 228 Contributors از ژوئن 2020.
  • NPM –Preact از ژوئن سال 2020 230k دانلود در هفته را در NPM ثبت کرد.


مزایای استفاده از Preact

  • اندازه کوچک - همانطور که قبلاً ذکر شد، شایستگی اصلی Preact.js اندازه کوچک آن است که فقط 3 کیلوبایت است، و آن را به یکی از سبکترین کتابخانه / فریم ورکی که می توانید پیدا کنید تبدیل کرده است. حتی با اندازه کمی که دارد، Preact در مقایسه با خواهر و برادر بزرگتر خود React که سایز 40-45kb (gzipped) دارد، عملکرد رندر سریع تری ارائه می دهد.
  • راندمان بالا - Preact نسبت به React در استفاده از حافظه بسیار مؤثر است به این معنی که جمع آوری زباله باید کارهای کمتری انجام دهد.
  • Preact CLI - Preact ابزاری بسیار قدرتمند برای رابط خط فرمان را ارائه می دهد كه به شما كمك می كند تا پروژه های جدید را بصورت یکپارچه و با سهولت ایجاد کنید و در عین حال تلاش خود را برای مقابله با Babel یا Web Pack نیز صرفه جویی کنید.
  • ماژول Link State - اگرچه Preact زیر مجموعه ای از React است ، اما تعداد کمی از ویژگی های پیشرفته خود را دارد. مهمترین آنها همه ماژول LinkState است که تغییرات حالت را بهینه می کند. واکنشی را نشان می دهد که از توابع پیکان در یک روش رندر () استفاده می کند تا حالت به روز شود. این روش با بسیاری از کدهای غیر ضروری بسیار ناکارآمد است. Preact این مشکل را با استفاده از ماژول LinkState حل می کند که یک عملکرد دسته را هنگام تصویب در وضعیت جزء به روزرسانی رویداد به طور خودکار تغییر می دهد.
  • سازگاری - همانطور که قبلاً بحث شد ، Preact از همان ES6 API با عنوان React استفاده می کند. این بدان معنی است که توسعه دهندگان می توانند به راحتی در یک پروژه موجود به Preact from React تغییر دهند.


معایب استفاده از Preact JS

  • جامعه کوچک و محبوبیت - Preact در مقایسه با React تنها با 200 مشارکت کننده در github، جامعه کوچکی دارد. Preact هنوز رایج نیست و فقط 20k وب سایت زنده با Preact.js در مقایسه با نیم میلیون در صورت React ساخته شده است.
  •  Preact از propTypes پشتیبانی نمی کند، یک ویژگی مهم در React.
  • یکی دیگر از بزرگترین اشکالات Preact این است که از ایجاد ClC پشتیبانی نمی کند. این تنها از اجزای کاربردی بدون تابعیت و مؤلفه کلاس مبتنی بر کلاس ES6 پشتیبانی می کند.


وب سایت های برجسته ساخته شده با Preact

Bluehive، Bustle، Dailymotion، Dev.to، Dominos، Financial Times، GroupOn، Hashi Corp، Housing.com، Lyft، Pepsi، Rocket Chat، Smashing Magazine، Synacor، Sogou Wenen، Tencent، Treebo، Uber.


6 . Svelte.js

رتبه ششم در لیست بهترین فریم ورک های جاوا اسکریپت 2020 به Svelte.js تعلق دارد. Svelte.js یک فریم ورک متن باز مبتنی بر کامپوننت JavaScript مبتنی بر منبع باز است که در Typescript نوشته شده است. ریچ هریس، توسعه دهنده پیشین گاردین، ​​پیشین ایجاد شده است. Svelte برای اولین بار در سال 2016 راه اندازی شد و از آن زمان تاکنون شاهد انفجار مطلق محبوبیت بوده است.


بسیاری از توسعه دهندگان Svelte را ایده ای واقعاً در حال تغییر بازی و انقلابی می دانند که اساساً نحوه کدگذاری برنامه های وب را تغییر می دهد و از Svelte استفاده می کنند تا Rehrone را به عنوان محبوب ترین فریم ورک فرانت اند در جهان معرفی کند.

Svelte برخلاف React یا Vue DOM مجازی ندارد. در عوض، شما کامپوننتهایی را بدون بویلر با کد HTML ،CSS و JavaScript ساده می سازید. Svelte کامپایلر سپس این کد را در طول زمان ساخت، به ماژول های کوچک وانیلی جاوا اسکریپت بدون چارچوب وارد کرده و با تغییر وضعیت ، DOM را به طور جراحی به روز می کند. بنابراین برخلاف سایر چارچوب های سنتی مانند React یا Vue ،Svelte نیازی به پردازش بالای مرورگر ندارد.

در نتیجه برنامه هایی که با Svelte ساخته شده اند رعد و برق سریع و دارای عملکرد عالی هستند. از دیگر مزایای اصلی این موارد، وابستگی صفر به مشتری، عدم وجود کتابخانه های مدیریت پیچیده دولت، از جمله Svelte می تواند نام های بزرگی مانند Godaddy Razorpay ،1password ،New York Times را به عنوان مشتری خود داشته باشد.

Svelte sage Statistics 2020

  • Svelte تقریباً 3 سال پس از انتشار اولیه، برای اولین بار به عنوان یکی از بهترین فریم ورک های جاوا اسکریپت موفق شده است برای اولین بار به رتبه بندی JS وارد شود. Svelte به عنوان پنجمین فریم ورک محبوب سمت کاربر جاوا اسکریپت که از رقابت های سطح بالایی مانند Ember و Polymer برخوردار بود، رتبه بندی شد.
  • سال 2019 برای Svelte سال مهیجی بود چون شاهد محبوبیت انفجاری ناگهانی و استقبال توسعه دهندگان اصلی JavaScript بود. اگرچه Svelte موفق به جلب نظر 6.8٪ از کاربران فعال طبق نظرسنجی State JS 2019 شد، اما بازبینی های rave را بدست آورده و از توسعه دهندگان گلایه کرده است. با توجه به اینکه 44.9٪ از توسعه دهندگان علاقه خود را به استفاده از Svelte در آینده نشان داده اند، یقینا Svelte مانند لژیونی وفادار طرفداران را به دست خواهد آورد و چالش بزرگی را برای Big 3 در سال 2020 رقم خواهد زد.
  • تقریباً 3600 وب سایت با Svelte acc ساخته شده اند. به آمار Wappalyzer / BuiltWith از ژوئن سال 2020.
  • نسخه فعلی - 3.20.1
  • Github - 32.8k Stars ،1.5k Forks ، 283 Contributors از ژوئن 2020
  • NPM –Preact از ژوئن سال 2020 بارگیری های بارگیری در هفته 52.5k را در NPM ثبت کرد.


مزایای استفاده از Svelte

  • Model -Svelte.js مبتنی بر کامپوننت از همان مدل مبتنی بر مؤلفه به عنوان فریم ورکی مانند React یا Vue پیروی می کند. ویژگی های جدید واکنش پذیری جدید در نسخه 3 Svelte باعث شده است تا با نوشتن کد کمتر، اجزای قابل استفاده مجدد حتی سریعتر و ساده تر شود.
  • آسان برای یادگیری - Svelte دارای یک منحنی یادگیری ملایم است و احتمالاً بیشتر برای توسعه دهندگان جدید مناسب است. قطعات قابل استفاده مجدد با کد ساده HTML ،CSS و JavaScript ساخته شده اند. دانش اضافی از typcript یا JSX لازم نیست.
  • اندازه کوچک - Svelte یکی از کوچکترین اندازه های بسته نرم افزاری را در بین سایر کتابخانه ها / چارچوب دارد، زیرا فاقد فریم ورک فاقد فریم ورک جاوا اسکریپت در هنگام اجرا است و کاملاً کامپایلر است.
  • عملکرد عالی - همانطور که قبلاً گفته شد، Svelte دارای DOM مجازی مانند React نیست، در عوض به برنامه نویسی واکنشی متکی است تا به روز رسانی جراحی DOM را انجام دهد. در نتیجه، Svelte قادر به دستیابی سریعترین رندر نسبت به تقریباً هر چارچوب دیگر است و بیشتر معیارهای عملکرد را در صدر خود دارد.
  • سئو - برخلاف برخی از فریمورک های دیگر که با خزنده های موتور جستجو سر و کار دارد، Svelte دوستانه SEO دارد.
  • پشتیبانی از مشتری و همچنین رندر سمت سرور.


    معایب استفاده از Svelte

    • پایگاه کاربر محدود - حتی اگر Svelte موفق به کسب تحسین و جوایز انتقادی در جامعه توسعه دهندگان شود، اما هنوز به صورت گسترده در صنعت مورد استفاده قرار نمی گیرد. Svelte.js چند مشتری بزرگ تحت نام خود دارد اما تعداد وب سایت های Svelte به سختی 3-4000 نفر هستند و تقریباً در ایالات متحده آمریکا هستند.
    • جامعه و منابع کوچک.
    • عدم وجود ابزار - یکی از بزرگترین شکایات علیه Svelte ، ابزار نابالغ ضعف آن برای برنامه های اشکال زدایی است.
    • عدم وجود مؤلفه های شخص ثالث - بر خلاف سایر چارچوب های React که مجموعه ای از کتابخانه های مؤلفه های شخص ثالث مانند - React Bootstrap ، Material UI ،UI Semantic UI ، طراحی مورچه ها و غیره وجود دارد ، Svelte هنوز به شدت از این حوزه استفاده نمی کند.
    • مسائل مقیاس پذیری - برخی از توسعه دهندگان ممکن است احساس کنند که Svelte دشوار است زیرا مقررات را به طور رسمی از typescript پشتیبانی نمی کند.


    وب سایت های برجسته ساخته شده با Svelte

    1Password ،AB Lab ،Absolute Web، Bekchy ،BlueHive ،Cashfree ،Chess، Comigo ،Entur ،Farmbox، Chusion Charts، Godaddy، HealthTree، Rakuten، Razorpay ،New York Times.



    منبع

    معرفی سیستم های مدیریت محتوا (رقبای وردپرس)

    نظرات

    برای ارسال نظر در سیستم ابتدا وارد شوید.

    هنوز نظری برای این مطلب ثبت نشده است.