تفاوت بین React Native ، NativeScript ، PWA و Hybrid App در توسعه کراس پلتفرم
ﺯﻣﺎﻥ ﻣﻄﺎﻟﻌﻪ: 14 دقیقه

تفاوت بین React Native ، NativeScript ، PWA و Hybrid App در توسعه کراس پلتفرم

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

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

طرفداران برنامه‌های بومی ادعا می‌کنند که رویکرد کراس پلتفرم نادرست است، همچنین تجربه‌ای ناخوشایند ایجاد می کند و هرگز نمی‌تواند جایگزین برنامه‌های نوشته شده با Objective-C و Swift برای آی او اس و Java و Kotlin برای اندروید شود. خب اگر ابزار مناسبی را انتخاب کنید، این ادعاها دیگر معتبر نیستند و مفهوم کنار گذاشتن ایده توسعه بومی برای مشاغل در هر اندازه‌ای کاملا منطقی است.

سال گذشته در کنفرانس Vue.js آمستردام، اعلام کردند نسخه NativeScript-Vue 1.0 را منتشر می‌کنند که به شما امکان ساخت برنامه برای آی او اس و اندروید را با استفاده از Vue.js می‌دهد. همانطور که Vue.js را دوست داریم، از آن استفاده می‌کنیم و از آن پشتیبانی به عمل می‌آوریم، نمی‌توانیم به این موفقیت بزرگ تیم آن اشاره‌ای نکنیم.

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

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

React Native

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

React Native یک راه حل آزمایش شده است که قبلا توسط اسکایپ، اینستاگرام و اوبر پذیرفته شده.

همچنین با امکان استقرار همزمان در دو سیستم‌عامل، انقلابی در توسعه تلفن همراه ایجاد کرد. هدف اصلی آن این است که "یک بار یاد بگیرید، همه چیز بنویسید". اما این جمله دقیقا به چه معنی است؟ اینکه شما هم برای آی او اس و هم برای اندروید یک ظاهر در برنامه بومی دارید، اما ممکن است ماژول‌های مخصوص پلتفرم را نیز در بر داشته باشید. مثلا نوارهای وضعیت، ناوبری یا دسترسی به عناصر بومی مانند دوربین و مخاطبین با توجه به سیستم‌عامل ساخته شده‌اند. برخی از این ویژگی‌ها در پکیج‌هایی موجود است، اما برخی دیگر باید از ابتدا نوشته شوند.

سوال این است که آیا می‌توانید از React Native برای نسخه وب، آی او اس یا اندروید استفاده کنید؟ در واقع با راه حل‌هایی مانند React Native For Web و ReactXP امکان پذیر است. هر دوی آنها بر اساس ری‌اکت و React Native ساخته می‌شوند و هدف آنها ارائه کامپوننت‌های معادل React Native برای ری‌اکت "regular" (یعنی مبتنی بر مرورگر) است.

چه زمانی باید از React Native استفاده کنید؟

قطعا زمانی که از ری‌اکت برای پروژه خود استفاده می‌کنید. همچنین اگر برای تمام نسخه‌های برنامه خود به ظاهر و استایل بومی نیاز دارید.

نقشه راه

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

"ما در حال کار بر روی یک معماری در مقیاس بزرگ برای React Native هستیم تا فریمورک را انعطاف پذیرتر کرده و با زیرساخت‌های بومی در برنامه‌های ترکیبی ادغام کنیم."

بیایید نگاهی بیندازیم به برخی از برنامه‌های React Native متن باز که امسال اتفاق می‌افتند و روش‌های دستیابی به آنها را بررسی کنیم:

  • هسته سبک: به دلیل از بین بردن اجزای غیرهسته‌ای و بلا استفاده، حجم React Native کاهش یافته و استفاده از آن ساده‌تر می‌شود.
  • به روز شدن ابزار داخلی: از آنجا که کار تیم فیسبوک با توسعه متن باز متفاوت است، React Native قصد دارد ابزارهای داخلی واحدی را معرفی کند. آنها همچنین با آوردن ماشین مجازی جاوااسکریپتی خود، پشتیبانی از کتابخانه‌های 64 بیتی در اندروید را تقویت خواهند کرد.
  • تست زیرساخت: آنها تست داخلی را انجام خواهند داد تا اطمینان حاصل کنند که تجربه فیسبوک با React Native تا آنجا که ممکن است به متن باز نزدیک است. در نتیجه ما قادر خواهیم بود درخواست‌های pull را سریعتر ادغام کرده و تست‌های بهتری را در نسخه اصلی هسته در گیت هاب دریافت کنیم.
  • API عمومی: این تیم شروع به تبدیل سایت‌های داخلی کرده است تا فیسبوک بتواند React Native را از طریق API عمومی استفاده کند و خطاهای ناخواسته را کاهش دهد.
  • ارتباطات: افزایش شفافیت و بحث آزاد در مورد گیت هاب قرار است ارتباط بین همه مشارکت کنندگان را یکپارچه کند. این تیم همچنین در حال برنامه ریزی برای بهبود تجربه کاربری با ایجاد محتوای با کیفیت و روی آوردن به اسناد مرجع API تولید شده به صورت خودکار است.

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

NativeScript

NativeScript یک پروژه متن باز است که به ساخت برنامه‌های بومی توسطAngular ،TypeScript ، JavaScript و اکنون نیز با Vue.js کمک می‌کند. NativeScript مشابه React Native کار می‌کند و امکان استقرار همزمان برنامه‌های کاملا بومی آی او اس و اندروید را فراهم می‌کند. علاوه بر این طیف وسیعی از فریمورک‌ها را ارائه می‌دهد که می‌توانید برای توسعه آنها را انتخاب کنید.

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

همانطور که قبلا اشاره کردیم، NativeScript-Vue اکنون در نسخه 1.0 است و این دلیل خوبی است که اگر از Vue.js در توسعه خود استفاده می‌کنید، آن را امتحان کنید. با توجه به گفته مغز متفکر آن یعنی ایگور راندلوویچ: "کار اولیه چند روز طول کشید و اجرای Weex (یک راه حل مشابه برای برنامه‌های تلفن همراه بومی که توسط Alibaba ساخته شده است) کمک بزرگی برای کشف همه چیز بود. یکی دیگر از منابع عالی، اجرای NativeScript-Angular بود که به من کمک کرد جنبه‌های NativeScript را بهتر درک کنم." تیم NativeScript در حال برنامه ریزی مراحل بعدی برای ادغام است و از همه دعوت می‌کند تا راه حل خود را امتحان کنند.

چه زمانی باید از NativeScript بهره بگیرید؟

اگر از Vue.js یا Angular استفاده می‌کنید و اگر به یک برنامه کاملا کراس پلتفرم برای آی او اس و اندروید با یک پایگاه کد احتیاج دارید، NativeScript فریمورک مناسبی است.

نقشه راه

آیا این سوال وجود دارد که NativeScript همچنان باقی می‌ماند؟ شک نکنید، همینطور خواهد بود و در جهتی توسعه خواهد یافت که انتظار آن را نداشته باشیم. زیرا NativeScript-Vue به عنوان بخشی از فریمورک اصلی NativeScript به طور رسمی پشتیبانی خواهد شد.

در اینجا برخی دیگر از برنامه ریزی‌های NativeScript ذکر شده که توسط مدیر محصول آن ارائه شده‌اند:

"این تیم کار خود را برای بهبود تجربه توسعه با HMR و Webpack ادامه خواهد داد و هدف این است که Webpack به تنها راه توسعه با NativeScript تبدیل شود. ما قبلا نشان دادیم که توسعه با Webpack HMR را امکان پذیر می‌کند، زمان ساخت بهتر برنامه را در حین توسعه فراهم می‌کند و برنامه را از نظر زمان راه اندازی بهینه می‌کند، بنابراین انتظار داریم که یک پیروزی بزرگ برای همه دوستداران NativeScript باشد."

چه چیز دیگری در NativeScript برای سال آینده وجود دارد؟ می‌توانید فعال کردن اشتراک کد بین وب و موبایل، یک ایده کاملا آزمایشی به نام nativescript-web، بهبود تجزیه و تحلیل و خدمات Crashlytics و دستیابی به یک رابط کاربری غنی و زیبا را انتظار داشته باشید.

برنامه‌های وب پیش رونده (PWA)

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

نکته‌ای که در مورد PWA وجود دارد این است که این برنامه‌ها در فروشگاه‌های برنامه موبایل قابل مشاهده نیستند، بنابراین انتخاب این روش، این چنین مارکتی را از دست می‌دهد. از طرف دیگر PWA وب را ترک نمی‌کند، بنابراین می‌توانید به راحتی آن را از طریق URL به اشتراک بگذارید. نقل از الکس راسل: "این برنامه‌ها فقط وب سایت‌هایی هستند که ویژگی‌های خاص را دربرمی‌گیرند. در نتیجه شما یک ترکیبی کاملا کارآمد همراه با وب دریافت می‌کنید که برای انواع دستگاه‌ها تنظیم شده، بسیار سریع و به صورت آفلاین نیز قابل دسترسی است، همچنین قابلیت ارسال اعلان‌ها را نیز دارد.

این برنامه‌ها تجربه کاربری بهتری را ارائه می‌دهند و اگر به وب سایت شما از طریق دستگاه‌های تلفن همراه مکررا دسترسی پیدا کنید، گزینه بسیار مناسبی محسوب می‌شوند. بار دوم (سوم یا چهارم) که یک بازدید کننده به وب سایت شما وارد می‌شود، فورا این پیشنهاد را دریافت می‌کنند که وب سایت را به صفحه اصلی خود اضافه کنید. پس دقیقا مانند یک برنامه بومی به نظر می‌رسد.

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

چه زمانی باید از PWA استفاده کرد؟

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

برنامه‌های هیبریدی (مانند Ionic)

اینگونه برنامه‌ها نه تنها منطق تجاری (جاوااسکریپت) بین وب و تلفن همراه، بلکه طرح بندی (HTML) و یک ظاهر طراحی شده (CSS) را نیز به اشتراک می‌گذارند. از آنجا که برنامه ترکیبی اساسا یک برنامه وب است که هنگام اجرا در مرورگر تلفن همراه با افزونه‌های بومی پیچیده شده است، همیشه عملکرد بالایی دارد و در دستگاه‌های هوشمند اما با سربار کمتر مورد توجه قرار می‌گیرد.

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

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

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

چه زمانی باید از برنامه‌های هیبریدی بهره بگیرید؟

هیبریدی‌ها برای اکثر برنامه‌ها، به ویژه B2B و هنگامی که شما نیاز به ساخت MVP با هزینه کم دارید، بسیار مناسب اند.

نقشه راه

در دنیای برنامه‌های هیبریدی چه می‌گذرد؟ ماکس لینچ - توسعه دهنده فریمورک Ionic - از انتشار آخرین پروژه خود خبر داد. با توجه به سخنان او:

"Capacitor به یک مفهوم رسمی بومی برای همه برنامه‌های Ionic تبدیل خواهد شد."

به منظور ایجاد Capacitor به عنوان یک مفهوم رسمی بومی برای همه برنامه‌های Ionic، تیم موارد زیر را انجام خواهد داد:

  • ادغام capacitor در محصول تجاری DevOps (Ionic Pro)
  • سرمایه گذاری بیشتر و تست خودکار برای افزایش دو برابری ثبات
  • اضافه کردن یک شاخص از پلاگین‌های موجود به منظور سهولت و یکپارچه سازی بومی برای توسعه دهندگان

چند مرحله دیگر نیز که تیم Ionic در حال کار بر روی آن هستند به وضوح در وبلاگ رسمی آنها ذکر شده است.

سخن پایانی

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

منبع

چه امتیازی برای این مقاله میدهید؟

خیلی بد
بد
متوسط
خوب
عالی
5 از 1 رای

/@heshmati74
عرفان حشمتی
Full-Stack Web Developer

کارشناس معماری سیستم های کامپیوتری، طراح و توسعه دهنده وب سایت

دیدگاه و پرسش

برای ارسال دیدگاه لازم است وارد شده یا ثبت‌نام کنید ورود یا ثبت‌نام

در حال دریافت نظرات از سرور، لطفا منتظر بمانید

در حال دریافت نظرات از سرور، لطفا منتظر بمانید

عرفان حشمتی

Full-Stack Web Developer

مقالات برگزیده

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

مشاهده همه مقالات