مقایسه Angular و React، کدام را انتخاب کنیم؟

در این مقاله، مقایسه‌ای دقیق بین جنبه‌های فنی و عمومی تکنولوژی‌های Angular و React ارائه می‌شود.

مقایسه‌های زیادی درمورد این دو تکنولوژی وجود دارد و این یک معجزه است که شما این مقاله را می‌خوانید?. اما آنچه که در مقاله‌های دیگر بررسی نشده، مقایسه دقیق این دو تکنولوژی در کنار هم بوده است.

در پایان این مقاله، متوجه می‌شوید که کدام تکنولوژی مناسب شما است. با یک تصویر کلی از تمام مباحث، شروع می‌کنیم و حتی شما به کمک این تصویر می‌توانید تصمیم بگیرید که React یا Angular را انتخاب کنید.

۱) مرور کوتاه

React

React یک کتاب‌خانه جاوااسکریپت برای توسعه UI است که توسط فیسبوک و جامعه توسعه‌دهندگان متن‌باز مدیریت می‌شود. این فریم‌ورک (در اصل یک کتاب‌خانه است ولی آن را به عنوان فریم‌ورک هم می‌شناسند) در May 2013 معرفی شد و آخرین به‌روزرسانی آن در 19 March 2020 منتشر شده است.

Angular

Angular هم یک فریم‌ورک متن‌باز جاوااسکریپتی برای توسعه وب و برنامه‌های موبایلی است. این فریم‌ورک مبتنی بر TypeScript است و توسط تیم Google’s Angular و جامعه توسعه‌دهندگان Angular مدیریت می‌شود.

این فریم‌ورک در سال 2016 ارائه شده، Angular را نیز با عنوان Angular 2.0 می‌شناسند زیرا در مقایسه با Angular 1.0 که در 2010 معرفی شده بود کاملا بازنویسی شده است. در حال حاضر 10 نسخه از این فریم‌ورک وجود دارد که آخرین نسخه آن در 15 July 2020 انتشار یافته است.

۲) فراگیری (Universality)

React

با این فریم‌ورک شما می‌توانید وب و برنامه موبایلی خود را توسعه دهید. با‌این‌حال برای توسعه در موبایل باید با Cordova ترکیب شود. علاو‌ه بر آن، برای توسعه برنامه موبایلی می‌توانید از فریم‌ورک React-Native استفاده کنید. React نیز می‌تواند در برنامه‌های وب یک صفحه‌ی (single-page) و چند صفحه‌ای (multi-page) مورد استفاده قرار گیرد.

Angular

Angular برای توسعه وب و برنامه‌های موبایلی کاملا مناسب است. با‌این‌حال در توسعه برنامه‌های تلفن همراه بیشتر کارها توسط Ionic انجام می‌شود. تشابه بین Angular و React در این است که هردوی آن‌ها یک فریم‌ورک جداگانه برای توسعه برنامه‌های موبایلی دارند. NativeScript همتای React Native است. همچنین Angular می‌تواند برای هر دو برنامه تک صفحه‌ای و چند صفحه‌ای مورد استفاده قرار گیرد.

۳) خودکفایی

React

React یک فریم‌ورک برای توسعه UI است، پس برنامه‌هایی که توسط React نوشته می‌شوند به کتاب‌خانه‌های جانبی دیگری نیاز پیدا می‌کنند. برای مثال: Redux، React Router یا Helmet، فرایند مدیریت Stateها یا مسیریابی و تعامل با API را بهینه سازی می‌کنند. عملکردهایی مانند data binding، مسیریابی مبتنی بر کامپوننت، تولید پروژه، اعتبارسنجی فرم یا تزریق وابستگی‌ها به نصب ماژول‌ها و کتاب‌خانه‌های دیگر، نیاز دارد.

Angular

Angular را می‌توان یک فریم‌ورک تمام عیار برای توسعه نرم‌افزار دانست که معمولا به کتاب‌خانه‌های اضافی احتیاجی ندارد. کلیه قابلیت‌هایی که در بخش React از آن‌ها نام بردیم توسط Angular قابل اجراست.

۴) پیچ‌وخم‌های یادگیری

React

React با امکانات حداقلی ارائه شده است، این یعنی هیچگونه ابزاری برای تزریق وابستگی، یا وجود قالب‌های کلاسیک یا دیگر ویژگی‌های پیچیده، وجود ندارد. اگر جاوااسکریپت را خوب بشناسید، این فریم‌ورک را بسیار راحت می‌توانید درک کنید.

با‌این‌حال، کمی زمان می‌برد تا یاد بگیرید چگونه می‌توان یک پروژه را راه‌انداری کرد، زیرا ساختار از پیش تعریف شده‌ای، وجود ندارد. همچنین شما نیاز دارید Redux را که در بیشتر از 50% برنامه‌های React استفاده شده، برای مدیریت Stateها یاد بگیرید. به‌روزرسانی‌های این فریم‌ورک باعث می‌شود، توسعه‌دهندگان نیاز به تلاش ثابتی برای یادگیری قابلیت‌های جدید داشته باشند. علاوه‌براین‌ها، best practice زیادی وجود دارد که شما باید در React آن‌ها را تمرین کنید تا کارها را صحیح انجام دهید.

Angular

Angular به‌ خودی خود یک کتاب‌خانه عظیم است که یادگیری آن‌ها در مقایسه با React، بسیار زمان‌بر است. درک Angular بسیار پیچیده است، سینتکس‌های غیرضروی بسیاری وجود دارد و مدیریت کامپوننت‌ها پیچیده است. برخی از ویژگی‌های پیچیده در هسته فریم‌ورک تعبیه شده است بنابراین توسعه‌دهندگان نمی‌توانند از یادگیری و استفاده از آن‌ها خودداری کنند. علاوه‌براین‌ها، روش‌های بسیار زیادی برای حل یک مسئله وجود دارد.

در طرف دیگر، TypeScript به جاوااسکریپت شباهت بسیاری دارد اما برای یادگیری آن باید زمان بگذارید. همچنین این فریم‌ورک به طور مداوم به‌روزرسانی می‌شود و توسعه‌ دهندگان نیاز دارند تا زمان بیشتری برای یادگیری ویژگی‌های جدید بگذارند.

۵) جامعه کاربری

React

فریم‌ورک React یکی از فریم‌ورک‌های جاوااسکریپتی مشهور در جهان است و جامعه‌ای که آن را توسعه می‌دهد و از آن پشتیبانی می‌کند، وسیع است.

برای کار با React شما باید مداوما در حال یادگیری باشید، زیرا این فریم‌ورک به سرعت به‌روز می‌شود. درحالی که جامعه React سعی می‌کند با آخرین مستندات (documentation)، این فریم‌ورک را به‌روز نگه دارد، اما رعایت همه تغییرهای اعمال شده در React، آسان نیست. در بعضی موارد ممکن است که مستنداتی وجود نداشته باشد اما اغلب به کمک جامعه‌های کاربری این موضوع حل می‌شود.

React توسط شرکت‌هایی مانند: Facebook, Twitter, Netflix, Airbnb, PayPal, The New York Times, Yahoo, Walmart, Uber, و Microsoft استفاده می‌شود.

Angular

در این بخش Angular در مقایسه با React کمتر مورد تحسین قرار می‌گیرد و در جاهایی شک و تردیدهایی وجود دارد. توسعه‌دهندگان فریم‌ورک Angular نسخه 1.0 را به عنوان یک فریم‌ورک بسیار پیچیده شناختد که زمان زیادی برای یادگیری لازم داشت و آن را قبول نکردند. هرچند که این فریم‌ورک توسط گوگل توسعه داده شده است ولی با نام Angular فعالیت می‌کند.

گوگل پشتیبانی بلندمدت از این فریم‌ورک را ارائه می‌دهد و مرتباً آن را بهبود می‌بخشد. با‌این‌حال که به‌روزرسانی‌ها اینقدر سریع هستند که داکیومنت‌های کاملی از آن‌ها در دسترس برنامه‌نویسان قرار نمی‌گیرد یا بخشی از آن‌ها جا می‌مانند.

Angular توسط شرکت‌هایی مانند McDonald’s, AT&T, HBO, Apple, Forbes, Adobe, Nike و Microsoft نیز استفاده می‌شود.

۶) عملکرد

React

عملکرد React با معرفی DOM مجازی بسیار بهبود یافته است، از آنجا که DOM treeهای مجازی، سبک هستند و بر روی سرور ساخته شده‌اند، بار مرورگر کاهش می‌یابد. علاوه‌بر‌این‌ها، از آنجا که فرایند data-binding به‌صورت یک‌طرفه است و عملیات binding نیازی به watcherها ندارند (مانند Angular)، هیچ کار اضافی بوجود نمی‌آید که در عملکرد تاثیر منفی ایجاد کند.

Angular

Angular در این قسمت عملکرد جالبی ندارد، به‌خصوص در برنامه‌های پویا و پیچیده وب، عملکرد بدی از خود نشان داده. عملکرد بد برنامه‌ای Angular در این قسمت، تاثیر گرفته از data-binding دوطرفه در این فریم‌ورک است. پیگیری هر عملیات binding به watcher سپرده می‌شود تا تغییرها را پیگیری کند و این چرخه تا زمانی ادامه پیدا می‌کند که تمام watcherها و مقادیر مرتبط با آن‌ها بررسی شود. به همین دلیل، هرچه bindingهای بیشتری در برنامه خود داشته باشید، watcherهای بیشتری ساخته می‌شوند و روند کار سخت‌تر می‌شود.

بااین‌حال، در جدیدترین به‌روزرسانی‌های اخیر این فریم‌ورک، Angular توانسته این موضوع را تا حد زیادی بهبود ببخشد تا رقابت را با React از دست ندهد. علاوه‌‌بر‌این‌ها، اندازه یک برنامه Angular از یک برنامه React کمی کوچک‌تر است.

۷) زبان

React

React بر اساس JavaScript ES6+ که با اسکریپت JSX ادغام شده، است. JSX یک افزونه برای سینتکس است که کدهای نوشته شده به زبان JavaScript، شبیه HTML به‌نظر برسند. این باعث می‌شود، کد ساده‌تر درک شود و علائمش راحت‌تر قابل مشاهده باشد. برای اینکه کدهای JSX به کدهایی کامپایل شود که توسط مرورگر قابل استفاده باشد، React از Babel که یک ابزار ترجمه کد است، استفاده می‌کند.

Angular

در Angular می‌توانید از زبان‌های JavaScript یا از TypeScript استفاده کنید، که به‌طور خاص برای توسعه پروژه‌های بزرگ‌تر با JavaScript توسعه داده شده است. کدها در TypeScript نسبت به JavaScript جمع‌وجور‌تر هستند و علائم به راحتی مشاهده می‌شوند. فرایند اصلاح کد نیز ساده‌تر و سریع‌تر است.

۸) ساختار برنامه

React

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

علاوه‌بر‌این‌ها، React فقط لایه view را ارائه می‌دهد در حالی که Model و Controllerها با استفاده از کتاب‌خانه‌های دیگر اضافه می‌شوند. معماری برنامه‌های React بر اساس کامپوننت (component-based) است. کدها با کامپوننت‌های React ساخته و در قدم بعد با استفاده از کتاب‌‌خانه React DOM رندر می‌شوند، کامپوننت‌ها را می‌توان به دو صورت: فانکشنال (فانکشنی که JSX را برمی‌گرداند)…

function Hello(props){
return <div>Hello {props.name}</div>
}

… و یا بر اساس کلاس (class-based)، تعریف کرد (با ES6 classes).

class Hello extends React.Component {
render() {
return <h1>Hello, {this.props.name}</h1>;
}

Angular

ساختار Angular ثابت و پیچیده است و برای توسعه‌دهندگان باتجربه مناسب است. Angular بر اساس سه لایه ساخته شده است: Model، Controller و View. هر آبجکت مسئول Modelی است که توسط Controller بوجود آمده و توسط View به نمایش درمی‌آید.

کدهای برنامه از اجزای کوچک‌تر که همان کامپوننت‌های Angular هستند، تشکیل می‌شود. هر یک در چهار فایل جداگانه نوشته می‌شود: یک فایل TypeScript برای پیاده سازی کامپوننت، فایل HTML برای تعریف View، فایل CSS برای تعریف ویژگی‌های ظاهری و یک فایل مخصوص برای تست اهدافی که از نوشتن این کامپوننت داشته‌ایم. این فایل‌ها در بخش app directive به همدیگر می‌پیوندند که منطق ساختاری برنامه را نشان می‌دهد، البته باید گفت که کامپوننت‌های Angular هم قابل استفاده دوباره هستند.

import { Component } from '@angular/core';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent { }

۹) کامپوننت‌های UI

React

ابزار‌های UI در React توسط جامعه کاربری این فریم‌ورک توسعه داده شده‌ است. کامپوننت‌های UI رایگان و پولی بسیاری در React portal وجود دارد. برای طراحی متریال در React باید کتاب‌خانه‌های اضافی مانند: Material-Ui و وابستگی‌هایش را نصب کنید.

Angular

Angular دارای ابزارهای داخلی برای طراحی متریال است که می‌تواند در طراحی متریال کامپوننت‌ها به شما کمک کند. دکمه‌های مختلف (button)، چیدمان‌ها (layout)، نشانگرها (indicator)، پنجره‌های بازشو (pop-up) و کنترل‌کننده‌های فرم مختلف وجود دارد، به همین دلیل‌، پیکربندی UI ساده‌تر و سریع‌تر می‌شود.

۱۰) دستورالعمل (Directives)

React

در React، قالب‌ها و منطق‌هایشان در یک مکان که در پایان هر کامپوننت است، توضیح داده می‌شوند. این باعث می‌شود حتی اگر خواننده سینتکس آن‌ها را نداند به سرعت کدها را درک کند.

A‌ngular

در Angular هر قالب با attribute بازگردانده می‌شود – یک دستورالعمل از اینکه هر آبجکت چگونه باید تنظیم شود. سینتکس دستور‌های Angular بسیار پیچیده است که باعث می‌شود خواننده‌های بدون تجربه نتوانند درکی از این موضوع داشته باشند.

۱۱) مدیریت stateها

React

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

class Clock extends React.Component {
constructor(props) {
super(props);
 this.state = {date: new Date()};
 }
render() {
return (
<div>
<h1>Hello world!</h1>
<h2>Now is {this.state.date.toLocaleTimeString()}.</h2>
</div>
);
}
}

برای حل این مشکل، یک کتاب‌خانه مخصوص مدیریت stateها به نام Redux وجود دارد. ایده کلی به این صورت است که state گلوبال به عنوان یک آبجکت stateful که در قسمت‌های مختلف برنامه به کمک کاهش‌دهنده‌ها (reducer) به‌خصوص فانکشن‌های Redux، ارائه شود.

راه‌حل دیگری توسط کتاب‌خانه MobX برای مدیریت state، ارائه شده است. برخلاف Redux که state گلوبال را در یک آبجکت stateful بدون تغییر ذخیره می‌کند، MobX پیشنهاد می‌دهد تا stateهای کوچک مورد نیاز را ذخیر کنیم، در حالی که دیگر stateها را می‌توان تغییر داد.

Angular

در Angular، داده کامپوننت در تنظیمات کامپوننت ذخیره می‌شود. کامپوننت‌های والد، داده‌ها را بین کامپوننت‌های فرزند جابه‌جا می‌کنند. در بعضی موارد، تغییر state می‌تواند شناسایی و مجدداً محاسبه شود. اما در برنامه‌های بزرگ می‌تواند باعث به‌روزرسانی‌های multi-directional tree شود که دنبال کردن آن، دشوار می‌شود. این ویژگی‌ها می‌توانند به کمک کتاب‌خانه‌هایی مانند: NgRx یا RxJS که برای مدیریت state توسعه داده شده اند، بهبود یابند و این اطمینان حاصل شود که جریان داده، یک طرفه است.

export class HeroListComponent implements OnInit {
heroes: Hero[];
selectedHero: Hero;
constructor(private service: HeroService) { }
ngOnInit() {
this.heroes = this.service.getHeroes();
}
selectHero(hero: Hero) { this.selectedHero = hero; }
} 

۱۲) Dependency Injection

React

dependency injection به طور کلی در React، پشتیبانی نمی‌شود زیرا این قابلیت با برنامه‌نویسی فانکشنال و تغییر ناپذیری داده‌ها مطابقت ندارد و فقط یک state گلوبال برای همه‌ی کامپوننت‌ها دارد.

Angular

بزرگ‌ترین مزیت Angular این است که بر خلاف React، از dependency injection پشتیبانی می‌کند. بنابراین، Angular اجازه می‌دهد چرخه‌های مختلف زندگی (lifecycles) را برای storeهای مختلف فراهم کنید.

import { Injectable } from '@angular/core';
import { HEROES } from './mock-heroes';
@Injectable({
// we declare that this service should be created
// by the root application injector.
providedIn: 'root',
})
export class HeroService {
getHeroes() { return HEROES; }
}

۱۳) اتصال داده‌ها (data-binding)

React

Data binding یا همان اتصال داده‌ها را به‌جای عنوان فرایند همزمانی داده (data synchronization process) در بین Model و View استفاده می‌کنند. در این مورد Redux به کمک توسعه‌دهندگان می‌آید که به شما این امکان را می‌دهد با داده‌های غیرقابل تغییر کار کنید و جریان داده‌ها را یک‌طرفه می‌کند. اتصال یک‌طرفه قابل پیش‌بینی است و روند اشکال زدایی را آسان می‌کند.

Angular

Angular با داده‌های متغیر و اتصال داده‌ها به‌صورت دو طرفه کار می‌کند. در حالی که مزایای داده‌های قابل تغییر و تغییرناپذیر یک بحث داغ است، قطعا کار با اتصال داده‌های دو طرفه آسان‌تر از کار با اتصال داده‌های یک‌طرفه است. درعین حال، اتصال داده‌های دوطرفه تاثیر منفی بر عملکرد می‌گذارد زیرا Angular به‌طور خودکار یک watcher برای هر اتصال داده قرار می‌دهد.

روش‌های اتصال داده در Angular:

{{expression}}   Interpolation
[target]="expression"    Property
bind-target="expression"    Attribute

(target)="statement" Event
on-target="statement" Event

[(target)]="expression" Two-way
bindon-target="expression" Two-way

۱۴) بهبود رندرینگ

React

React از یک DOM (Document Object Model) مجازی استفاده می‌کند که به‌راحتی و بدون به‌روزرسانی کل ساختار DOM، ایجاد تغییرهای جزئی داده را در یک المنت امکان پذیر می‌کند. این فریم‌ورک یک حافظه پنهان از نوع in-memory از ساختار داده می‌سازد. تغییرها را محاسبه می‌کند و به‌روزرسانی‌های موثر در DOM را در مرورگر نمایش می‌دهد. به‌این ترتیب، به نظر می‌رسد با هر تغییر صفحه یکبار دیگر رند می‌شود در حالی که در واقعیت، کتابخانه‌ها تغییرهای subcomponent را رندر می‌کنند.

تیم React دائماً Fiber را بهبود می‌بخشد – Fiber مکانیزمی با هدف تقویت (بهبود) رندر تغییرات است.

Angular

Angular از DOM واقعی استفاده می‌کند، حتی زمانی که یک تغییر جزئی در المنتی ایجاد شود، تمام ساختار DOM را به‌روز می‌کند. DOM واقعی نسبت به DOM مجازی، کندتر و کم تاثیرتر به‌نظرمی‌رسد.

برای جبران این نقطه ضعف، Angular از شناسایی تغییر (change detection) برای شناسایی کامپوننت‌هایی که نیاز به تغییر دارند، استفاده می‌کند. بنابراین، DOM واقعی در Angular به همان اندازه DOM مجازی در React، موثر است.

۱۵) ابزارها

React

React توسط ویرایشگر‌های کد مختلفی پشتیبانی می‌شود. به عنوان مثال کدها در React می‌توانند با Sublime Text, Visual Studio و Atom ویرایش شوند. برای راه‌اندازی یک پروژه می‌توانید از ابزار Create React App (CLI) استفاده کنید. به‌نوبه‌خود، رندر سمت سرور با استفاده ازفریم‌ورک Next.js تکمیل می‌شود.

برای تست برنامه‌ای که با React نوشته‌اید، به ابزار‌های مختلفی نیاز دارید. برای مثال: Enzyme برای تست کامپوننت‌ها، Jest برای تست کدهای جاوااسکریپت، React-unit برای انجام unit test و …

برای دیباگ کردن برنامه در حالت توسعه هم می‌توانید از افزونه React Dev Tools در مرورگر استفاده کنید.

یکی از ابزار‌های جالبی که وجود دارد، React 360 است که برای ساخت برنامه‌های AR و VR مورد استفاده قرار می‌گیرد.

Angular

Angular هم مانند React توسط طیف وسیعی از ویرایشگرهای کد، پشتیبانی می‌شود. به عنوان مثال، شما ممکن است با ویرایشگرهای کد مانند Aptana، Sublime Text و Visual Studio کار کنید. یک پروژه می‌تواند به سرعت با Angular CLI پیکربندی شود. رندرینگ سمت سرور با کمک Angular Universal ارائه می‌شود.

برخلاف React، این فریم‌ورک می‌تواند با یک ابزار، کاملا تست شود. برای تست end-to-end در Angular پلتفرم‌هایی مانند: Jasmine، Protractor و Karma وجود دارد. ابزاری دیگری که برنامه را در حالت توسعه اشکال زدایی می‌کند‌، افزونه مرورگر Augury است.

جمع‌بندی

Angular یک فریم‌ورک توسعه کامل برای وب و موبایل است. React هم یک فریم‌ورک برای توسعه UI است که می‌تواند با کمک کتاب‌خانه‌های اضافی به یک فریم‌ورک تمام عیار تبدیل شود.

React در نگاه اول ساده به‌نظر می‌رسد و زمان کمتری هم برای یادگیری و شروع پروژه‌تان نیاز دارید اما این مزیت خنثی می‌شود زمانی که نیاز داشته باشید فریم‌ورک‌های دیگر جاوااسکریپت و ابزارهای دیگر را یاد بگیرید.

Angular پیچیده‌تر است و زمان بیشتری برای یادگیری نیاز دارد، اما یک ابزار قدرتمند است که یک تجربه توسعه جامع وب را در اختیار توسعه‌دهنده قرار می‌دهد و هنگامی که آن را فرا بگیرید می‌توانید ایده‌هایتان را خلق کنید.

هیچ فریم‌ورک کاملی وجود ندارد، هر دوی این فریم‌ورک‌ها به‌طور مداوم به‌روز می‌شوند تا در کنار هم رقابت کنند. برای مثال، درحالی که انتظار می‌رفت React با DOM مجازی پیروز شود، Angular با افزودن change detection امتیاز را مساوی کرد.

یا در حالی که Angular توسط یک شرکت معتبر مانند Google ساخته شده و این اعتبار Angular را به پیروز میدان تبدیل می‌کند. اما جامعه اختصاصی React کاملاً شهرت گوگل را جبران کرد و React را با Angular مساوی کرد.

در پایان باید بگوییم انتخاب بین React و Angular، به علاقه شخصی یا مهارت‌ها و عادت‌های توسعه‌دهنده مربوط می‌شود، اگر به عنوان یک مبتدی در برنامه‌نویسی تازه شروع به کار کرده‌اید، احتمالاً از کار با React بیشتر سود خواهید برد. به عنوان یک توسعه دهنده با تجربه، شما فقط با آنچه بهتر می‌دانید کار می‌کنید.

فراموش نکنید که خودتان را به چالش بکشید و یادگیری یک فریم‌ورک جدید، React یا Angular را شروع کنید. به عنوان یک مدیر پروژه یا یک صاحب مشاغل که از توسعه دهندگان پشتیبانی می‌کند، باید با تیم توسعه وب خود صحبت کنید و در کنار هم فریم‌ورکی را انتخاب کنید که مناسب همه شما باشد، خواه Angular باشد یا React.

منبع: https://www.freecodecamp.org/news/angular-vs-react-what-to-choose-for-your-app-2