آشنایی با AngularJS در طراحی سایت (بخش اول) 

Introduction to AngularJS Part 01

با گسترش وسایل لمسی، اپلیکیشن‌های آن نیز مورد توجه قرار گرفته است. اغلب اپلیکیشن‌ها، عملکردی ساده دارند و با کمک Html و Javascript قابل پیاده‌سازی هستند. از سوی دیگر نیز، بسیاری از پایگاه‌های اطلاعاتی و سایت‌ها، دارای یک اسکلت مشخص هستند که تنها برخی دیتاهای آن تغییر می‌کند.
دو عامل فوق باعث شده که فریم‌ورک‌های جاوا اسکریپتی مبتنی بر الگوی MVC (که در آن داده‌ها و تمپلت از کنترلر مستقل هستند) در سال‌های اخیر رشد زیادی کنند که فریم‌ورک‌های: Angular, Ember, Backbone, Knockout چهار نمونه معروف از آنها هستند که البته رغبت جهانی به سمت AngularJS بوده و به شدت در طراحی سایت در حال رشد است.

به اینگونه برنامه‌ها (که دارای یک اسکلت ساده یا تک‌صفحه‌ای هستند)، در اصطلاح SPA گفته می‌شود که مخفف Single Page Application است.
AngularJS توسط Misko Hevery از شرکت Google ایجاد شده و به دلیل قدرتش بسیار هم مورد رغبت برنامه‌نویسان در طراحی سایت قرار گرفته، لذا تمرکز اصلی مطلب فعلی نیز روی آن است.
مزایا و معایب استفاده از این فریم‌ورک‌ها برای ما برنامه نویسان در طراحی سایت چیست؟
مهم‌ترین حسن این کار برای برنامه‌نویسان، انداختن بخشی از بار سرور روی کلاینت است!
در حالت عادی ما بخشی از پردازنده سرور صرف قرار دادن اطلاعات (Data) در قالب (Template) می‌شود و نهایتا سورس کامل Html صفحه به سمت کاربر ارسال می‌شود. اما در صورت استفاده ازAngularJS ، قالب (Template) یکبار لود می‌شود و بعد از آن فقط دیتا رد و بدل می‌شود. درست مانند محیط جیمیل. این کار بار پردازشی سرور و همچنین پهنای باند مصرفی کاربر و سرور را به شدت کاهش می‌دهد.
شاید تصور کنید که AngularJS همان Ajax است! اما خیر؛ AngularJS یک فریم ورک مبتنی بر MVC است که از Ajax نیز استفاده کرده است.
و اما معایب آن: برای کلاینت که اشکالی ندارد و بلکه به دلیل کاهش پهنای باند مصرفی، کاملا به نفع کاربر هم هست اما برای برنامه‌نویسان چطور؟
شاید بتوان گفت که مهم‌ترین اشکال سپردن Template Engine به کلاینت (جاوا اسکریپت)، مساله SEO است. این امر باعث میشود که AngularJS برای برنامه‌هایی مفید باشد که مساله SEO برای‌شان مهم یا اصلا مطرح نیست! (مثلا برنامه‌هایی که برای یک یا چند کاربر محدود قرار است نمایش داده شود) مثل جیمیل یا یک برنامه درون سازمانی که فقط افراد معدودی قرار است به آن دسترسی داشته باشند نه Search Engine ها (یا برنامه‌های موبایل (App) که با Html و js ساخته می‌شوند.
آیا برای حل مشکل SEO ی AngularJS راه حلی وجود دارد؟
بله اما کمی سختی دارد!
از سال‌ها قبل، مشکل موتورهای جستجو با محتویاتی که Ajax  ی لود می‌شود، مطرح بود و راه‌حل‌هایی برای آن مطرح شد که از سوی بسیاری از برنامه‌نویسان در طراحی سایت پذیرفته شده و مبنای کار قرار گرفته است. هرچند راه حل اصلی همان است که گوگل در پی آن است؛ اجرای سایت به صورت یک کاربر واقعی و سپس ذخیره اطلاعات نمایش داده شده. این کار هم مشکل محتویات js ی را در طراحی سایت حل می‌کند و هم مانع ایندکس شدن محتویات اسپم می‌شود.
البته تکنیک‌های دیگری نیز وجود دارد مثل شناسایی موتورهای جستجو و نمایش محتوای خاص به آنها و ... . مقالهAngularJS and SEO جزو بهترین مقالات آموزشی در این زمینه ی طراحی سایت است. پروژه Prerender.io نیز برای تسهیل این کار با نصب برنامه خاص روی سرور اقدام کرده است که قابل تقدیر است.
در بخش بعدی مقاله آموزش این فریم ورک جذاب در طراحی سایت را باهم بررسی می کنیم..
شرکت داده پردازی فراتک با طراحی بیش از 500 وب سایت، در سال های فعالیت خود و با به کارگیری این تکنولوژی آماده ارائه خدمات در زمینه طراحی وب سایت با ویژگی های منحصر به فرد است. از نمونه کارهای ما دیدن فرمایید: www.faratechdp.com

ویرایش: واحد تحقیق و توسعه شرکت داده پردازی فراتک (محمد شیرعلی زاده - طراحی سایت مشهد)

مرتبط: نمونه طراحی سایت - طراحی سایت مشهد