آیا با معماری JAMstack آشنایی دارید؟

کلیت JAMstack

اگر از توسعه دهندگان دنیای وب باشید و هر از گاهی سری به منابع خارجی نیز بزنید، احتمالا نام JAMstack را شنیده اید. بسیاری از توسعه دهندگان در حال برنامه نویسی با معماری JAMstack هستند اما خودشان نمی دانند! در واقع JAMstack نوعی معماری جدید برای برنامه های تحت وب است، بنابراین نه زبان برنامه نویسی است و نه ابزار خاصی برای توسعه ی وب، بلکه روشی برای توسعه ی وب است که سعی می کند وب سایت شما را امن تر کرده، عملکرد و سرعتش را بهبود بخشیده، هزینه ی مقیاس پذیری (بزرگ تر کردن وب سایت از نظر ارتقاء سرور و توسعه کلی در صورت محبوب شدن سرویس شما) را پایین آورده و در نهایت تجربه ی توسعه را برای همه شیرین تر کند.

بر اساس documentation معماری JAMstack در سایت رسمی شان:

JAMstack is a Modern web development architecture based on client-side JavaScript, reusable APIs, and prebuilt Markup.

The JAMstack is not about specific technologies. It’s a new way of building websites and apps that delivers better performance, higher security, lower cost of scaling, and a better developer experience.

ترجمه ی مضمون این گفته این می شود که JAMstack نوعی معماری مدرن برای توسعه وب است که بر این پایه ها بنا شده است: جاوا اسکریپت (سمت کاربر) API های قابل بازیابی و استفاده ی چند باره و Markup (الگوی کلی کدنویسی) از قبل آماده شده.

JAMstack محدود به تکنولوژی خاصی نیست بلکه روشی برای ساختن وب سایت های سریعتر، با امنیت بیشتر، هزینه ی کمتر برای مقیاس دهی و تجربه ی توسعه ی بهتر است.

عناصر تشکیل دهنده ی JAMstack

اگر دقت کرده باشید اگر در دنیای توسعه ی وب از چند تکنولوژی در یک موقعیت استفاده شود، از اسم آن تکنولوژی ها برای ساخت یک کلمه ی جدید استفاده می شود! به طور مثال AJAX مخفف asynchronous JavaScript and XML (به معنی «جاوا اسکریپت و XML نامتقارن) است. JAMstack نیز از این قاعده مستثنی نیست و در واقع مخفف موارد زیر است:

• JavaScript
• API
• Markup

توضیحی در مورد Stack: کلمه ی Stack در دنیای توسعه ی وب معمولا اشاره به ترکیب چندین تکنولوژی مختلف دارد که برای ساخت یک وب سایت یا برنامه ی موبایلی مورد استفاده قرار می گیرند. بنابراین JAMstack یعنی ترکیبی از تکنولوژی های JavaScript و API و Markup که نام گذاری بسیار جالبی است!

برنامه های JAMstack معمولا وابسته به یک سرور نیستند بلکه معمولا بین چندین سرور پخش می شوند بنابراین به خاطر استفاده از CDN ها و معماری خاص  JAMstack این نوع برنامه ها سرعت و کارایی بسیار بالایی دارند.

بررسی برخی مفاهیم

ممکن است با برخی از مفاهیمی که بالاتر ذکر شد آشنا نباشید. بنابراین می خواهم یک بار آن ها را توضیح دهم تا در ادامه ی مقاله دچار مشکل نشوید:

• API: مخفف عبارت Application Programming Interface است که در فارسی به آن رابط برنامه نویسی می گوییم. API ها یک میانجی هستند که از طریق آن ها دو وب سایت می توانند با یکدیگر ارتباط برقرار کرده و اطلاعات را تبادل کنند.
• CDN: مخفف عبارت content delivery network یا شبکه ی توزیع محتوا می باشند. این سیستم یک شبکه ی پراکنده از سرورهاست که بر اساس مکان فیزیکی کاربر و نزدیکی آن با هر سرور از همان سرور محتوا را برای او ارسال می کنند.
• Server: سرورها دقیقا یک کامپیوتر هستند و فرق آنچنانی (به جز برخی جزئیات) با کامپیوترهای شخصی ندارند. این کامپیوترها برای پردازش درخواست ها و توزیع محتوا، از طریق یک شبکه محلی یا اینترنت، طراحی شده اند.
• Database: دیتابیس یا پایگاه داده، مکانی است که داده ها و اطلاعات (چه متعلق به کاربران و چه غیر از آن) در آن ذخیره می شود تا بعد ها در صورت نیاز ویرایش شده، حذف شوند و یا اطلاعاتی به آن ها اضافه شود.

JAMstack دقیقا چیست؟

وب سایت های سنتی تر از جمله CMS هایی مانند WordPress و Drupal و... به شدت به سرورهایشان، پلاگین ها و پایگاه های داده وابسته هستند اما JAMstack حجم پایینی از جاوا اسکریپت را بارگذاری می کند که از طریق یک API، داده هایی را دریافت کرده و آن ها را از طریق یک CDN و تولید کننده ی markup به کاربر تحویل می دهد.

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

JAMstack سریع است

زمانی که موضوع بحث ما سرعت بارگذاری (time of load) باشد، چیزی توان مقابله با فایل های از قبل آماده و توزیع شده از طریق CDN را ندارد. سایت هایی که بر اساس معماری JAMstack طراحی شده اند، بسیار سریع هستند، چرا که HTML در زمان تست های نهایی سایت و فعال کردنش روی سرور (از طریق CDN) ساخته شده است، بنابراین هیچ دخالتی از سمت back-end در این زمینه وجود نخواهد داشت.

JAMstack کاملا امن است

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

توسعه ی کسب و کار با JAMstack بسیار ساده تر و ارزان تر است

مقیاس دهی وب سایت های JAMstack نکته ی قابل توجهی است، چرا که تنها متشکل از فایل های کوچکی هستند که می توانند از هر جایی توزیع شوند. بنابراین مقیاس دهی (آوردن سایت روی سرور های قوی تر و توسعه کلی) سایت های JAMstack بسیار ارزان و آسان خواهد بود.

بهترین روش های استفاده از JAMstack

هنگامی که تصمیم به کار با JAMstack گرفتید، بهتر است از نکات زیر پیروی کنید تا بیشترین نتیجه را از JAMstack بگیرید:

• برای توزیع محتوای خود از CDN ها استفاده کنید.
• پیاده سازی و انجام کارهای پروژه تان باید ساده و آسان باشند. به همین منظور از ابزارهایی مانند npm و Git استفاده کنید تا راه اندازی ساده تری را تجربه کنید.
• از ابزارهای مختلف برای ساخت وب سایت استفاده کنید تا در تمام مرورگرها قابل دسترسی باشد (ابزارهایی مانند Babel, Browserify, Webpack و ...).
• مطمئن شوید که پروژه ی شما بر اساس معیارهای امروزی دنیای وب طراحی شده و کاملا قابل دسترسی است.
• از خودکار بودن فرآیند ساخت اطمینان حاصل کنید تا استرس خود و تیم خود را کاهش دهید.
• فرآیند deploy (تست های نهایی و قرار گیری سایت روی سرور واقعی) را خودکار کنید. برای این کار می توانید از سرویس هایی مانند Netlify استفاده کنید.

در حال حاضر فناوری های مختلفی به صورت پیش فرض در JAMstack قرار دارند که می توانید از آن ها استفاده کنید. از این فناوری ها می توان به Gatsby و NuxtJS و Hugo و Netlify CMS و ... اشاره کرد.