تکنولوژی AJAX چیست و چه کاربردی در طراحی صفحات وب دارد؟

تکنولوژی AJAX یا (ایجکس،اژاکس) یک تکنیک پرکاربرد در طراحی وب، برای تبادل اطلاعات با سرور و به روزرسانی بخش هایی از محتوای صفحه وب بدون نیاز به لود و بارگذاری مجدد کل صفحه می باشد.

استفاده از AJAX برای کاربران و هم برای صاحبان سایت، منفعت های بسیاری دارد. برای نمونه، دیگر لازم نیست کاربر مدت زمان بسیاری منتظر بارگذاری کامل صفحه بماند. و در پهنای باند او نیز صرفه جویی می شود. در مقابل صاحبان سایت نیز با ارائه یک تکنولوژی جدید و بسیار کاربردی می توانند مشتریان بیشتر و سرویس دهی بهتری داشته باشند.

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

مطالب مرتبط: فیچراسنیپت گوگل چیست؟

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

معرفی تکنولوژی AJAX ایجکس

معرفی تکنولوژی AJAX ایجکس
معرفی تکنولوژی AJAX ایجکس

سرواژه AJAX مختصر شدۀ عبارت Asynchronous JavaScript And XML و به معنای ترکیب جاوا اسکریپت و xml غیرهمزمان و ناهمگام است. آشنایی با این تکنولوژی پرکاربرد برای توسعه دهندگان و طراحان امری ضروریست.

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

مطالب مرتبط: TTFB چیست؟ تأثیر TTFB برسئوی سایت چیست؟

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

اگر فناوری AJAX نبود، کاربر برای دریافت اطلاعات از سرور، حتی اطلاعات سبک، می بایست کل صفحه را Refresh می‌کرد. بسیاری از سایت های معروف دنیا مانند Gmail ،YouTube و Facebook به صورت گسترده از این فناوری استفاده می کنند.

تاریخچه فناوری AJAX

فناوری هایی که Ajax را تشکیل می دهند علی رغم تمام جذابیت ها و مزایای خود جدید و نوین نیستند. توانایی برقراری ارتباط با سرور، از طریق یک فریم مخفی و بدون ارسال صفحه اصلی به سرور، از مدت ها پیش شناخته شده است. برقراری ارتباط میان کلاینت و سرور، از زمان معرفی قابلیت Internet Explorer برای اسکریپت نویسی کنترل های ActiveX برروی مرورگر کلاینت (که به اواخردهه ۱۹۹۰میلادی بازمیگردند) قابل دسترسی بوده است.

اجزای تشکیل دهنده ایجکس

اجزای تشکیل دهنده ایجکس
اجزای تشکیل دهنده ایجکس

شئ XmlHttpRequest

شئ XMLHttpRequest به عنوان هسته اصلی برنامه نویسی Ajax عمل می کند. و به مرورگر امکان می دهد که تا بدون نیاز به یک Post back از تمام صفحه وب، با یک سرور Back-end ارتباط برقرار کند.
مرورگرها به روش های مختلفی از این شئ پشتیبانی می‌کنند. این شئ به صفحات وب این امکان را می دهد تا از طریق کدهای سمت کلاینت درخواست هایی را برای سرویس دهنده ارسال نمایند و داده هایی را دریافت کنند. داده ‌های دریافتی توسط این شی پردازش می شوند.
درواقع این شئ برای ایجاد یک کانال ارتباطی مستقل بین مرورگر کاربر و سرور مورد استفاده قرار می گیرد.

جاوا اسکریپت JS

جاوااسکریپت قابلیت هایی برای برقراری ارتباط با سرور Back-end را تامین می کند. جاوا اسکریپت باید نسخه ۱/۵ یا بالاتر از آن باشد. با وجود آنکه جاوااسکریپت امری ضروری نیست، اما از نظر اینکه تنها محیط اسکریپ نویسی سمت کلاینت است و تمام مرورگرهای وب امروزی از آن پشتیبانی می کنند، مورد نیاز می باشد. زبان های اسکریپت نویسی سمت کلاینت دیگری نیز وجود دارند، اما در تمامی مرورگرها پشتیبانی نمی شوند.

پشتیبانی از DHTML/DOM

مرورگر باید از توانایی بروزرسانی داینامیک عناصر پشتیبانی نماید و امکان توانایی انجام این کار با یک شیوه استاندارد از طریق پشتیبانی از(DOM(Document Object Model فراهم می شود.

XMLیاJSON

استفاده از XML توانایی برقراری ارتباط با سرور وب در یک مکانیزم استاندارد را فراهم میکند. شرایطی وجود دارند که درآن ها از (JSON (JavaScript Object Notation به جای XML مستقیم برای نشان گذاری (Notation) ارتباط استفاده می شود.

تکنولوژی های ایجکس

  • اژاکس تنها یک کلمه است اما پشت آن مفاهیم و تکنولوژی های بسیاری قرار دارد. که استفاده از این تکنیک را میسّر می سازد. تکنولوژی هایی که در سرور فعال هستند و تداخلی با فعالیت کاربر در سایت ندارند.
  • HTML یا XHTML و CSS بخشی مهمی در کار با AJAX هستند و به کمک آن ها محتوای صفحه نمایش داده می شود.
  • از فناوری DOM (Document Object Model) برای تعامل بیشتر با داده‌ها و نمایش پویای عناصر استفاده می شود.
  • به کمک XML داده ها را تبادل نموده و با XSLT داده ها را مدیریت می کنیم.
  • شئ XMLHttpRequest نقش مهمی در Ajax ایفا میکند. و اجازه می دهد داده ها به صورت نامتقارن جا به جا شوند.
  • همچنین برای یکپارچه سازی تکنولوژی های بالا از زبان جاوا اسکریپت استفاده می شود.
  • به دلیل سنگین بودن فرمت XML، برای تبادل داده ها بیشتر JSON را به کار می بریم.

نحوه عملکرد AJAX

نحوه عملکرد AJAX
نحوه عملکرد AJAX
  • عملکرد این تکنولوژی طی چند مرحله و با ایجاد یک رویداد آغاز می شود. برای نمونه، با کلیک برروی یک دکمه یا لینک و یا فوکوس برای تایپ در فیلد نام کاربری در یک فرم ثبت نام، می تواند به عنوان یک رویداد برای اجرای کدهای جاوا اسکریپت جهت ارسال داده های بخش معینی به سرور تعیین شود.
  • پس از اینکه رویدادی اتفاق می افتد، ابتدا مرورگر به کمک جاوااسکریپت یک شئ XMLHttpRequest یا XHR می سازد و در خواست به شکل Httprequest به سرور ارسال می شود.
  • این شئ یک API یا Application Programming Interface می باشد. که می تواند با جاوا اسکریپت، انواع مرورگرها و زبان های دیگر به منظور انتقال و مدیریت داده های XML ارسالی و
  • دریافتی از مرورگرها از طریق HTTP مورد استفاده قرارگیرد.
  • اژاکس از طریق شئ ساخته شده، داده ها و اطلاعات مورد نظر را از سوی کاربر به سمت سرور ارسال می کند. این درخواست در سرور، دریافت و پردازش می شود. سپس نتیجه ی نهایی آن به مرورگر باز می گردد.
  • در مرحله ی آخر مرورگر داده های بازگشتی را به کمک جاوا اسکریپت دریافت و باز می گرداند. و بر اساس نحوه ی طراحی برنامه نویس وب، محتوای صفحه به روز می شود.

مزایای AJAX

مزایای استفاده از اژاکس در وب سایت ها عبارتند از:
• رندر شدن سریع تر صفحات
• خواندن اطلاعات از سرور پس از لود شدن صفحه
• بروزرسانی صفحه وب بدون نیاز به بارگذاری مجدد
• ارسال دیتا به سرور در پس زمینه سایت
• پشتیبانی از به روزرسانی هر بخشی از صفحه وب
• رابط کاربری سریع و پرمحتوا
• کاهش مصرف منابع سرور
• در نسخه NET4.0 این امکان فراهم شده تا داده های JSON از سرور با روشی کاملا موثر و قابل مدیریت، به زبان HTML رندر شوند.

معایب AJAX

معایب AJAX
معایب AJAX

• با توجه به پویا بودن تکنولوژی AJAX، امکان دارد که Crawler گوگل به درستی نتواند در محتوای صفحات بخزد. این امر سبب می شود تا صفحاتی که با این تکنولوژی نوشته شده اند، از نظر سئو رتبه خوبی کسب نکنند.
• دشواری در رفع مشکل و تست کدهای برنامه های اژاکس
• کاهش سرعت لود شدن سایت
• استفاده از درخواست xmlhttp که توسط برخی از مرورگر‌ها پشتیبانی نمیشود.
• اجرا نشدن دستورات AJAX در مرورگری که از قابلیت جاوا اسکریپت پشتیبانی نمیکند. یا این قابلیت مرورگر توسط کاربر غیرفعال شده باشد.

مطالب مرتبط: نرخ تبدیل یا Conversation rate چیست؟

موارد استفاده از ایجکس

بهتر است از این تکنولوژی در پنل کاربری و مدیریتی که نیاز به ایندکس شدن و سئو ندارد و همچنین شامل محتویات خواندنی توسط کاربران نیست، استفاده شود. در این بخش برخی از کاربردهایی که بهتر است از AJAX در آن ها استفاده شود را شرح می دهیم.
• اعتبار سنجی فرم ها
• لایت باکس
• مرتب سازی یا فیلتر
• رای دهی
• لایک و ستاره دار کردن
• چت و گفتگوها
• کپچا (Captcha)
• موارد خاص در پروژه های اختصاصی

جمع بندی

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

ارسال یک نظر

نشانی ایمیل شما منتشر نخواهد شد.