راههای افزایش کارایی سایت و کاربرد تحت وب

می 26, 2008 at 5:05 ق.ظ | In برنامه نویسی/کد نویسی یا توسعه | 1 Comment
Tags: , , ,

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

لذا در اینجا ، چند اصل از اصول مهم افزایش کارایی رو که باید هنگام طراحی صفحات وب رعایت کنیم رو شرح میدم:

1- درخواستهای صفحه رو کاهش بدید:منظور من از درخواست همون Request هست که توسط صفحه وب شما به سرور ارسال میشه.بعنوان مثال ، گاها دیدیم که یک طراح ، یک نقشه رو به تکه هایی تقسیم کرده و هر یک از این تکه ها که یک تصویر هستند رو داخل تگ a قرار داده و براشون لینک گذاشته.در نتیجه مثلا برای نقشه کشور ، اگر بخایم تصویری بسازیم که در اون کاربر با کلیک روی هر استان به لینک اون استان ارجاع داده بشه ، بجای اینکه مثلا نقشه ایران رو به 30 تصویر مجزا تقسیم کنید که باعث میشه شما 30 تگ از نوع img داشته باشید ، بهتره که از یک تصویر استفاده کنید و در عوض از روش Image Maps ( با استفاده از تگ AREA) استفاده کنیم.و یا بعنوان نمونه دیگر ، بسیاری از دکمه ها یا Button در صفحات وب هستند که بصورت یک پرونده گرافیکی طراحی شده اند و زمان زیادی باید صرف بشه تا براوزر اونها رو از سرور بارگذاری بکنه.روشهای بهتر این هست که یا از یک پرونده گرافیکی بسیار کوچک بعنوان Background یک سلول از جدول استفاده کنیم و متن خودمونرو اونجا بنویسیم و یا بجای اینکه یک دکمه کاملا گرافیکی را قبلا طراحی کنیم و کاربر مجبور باشه اونرو بطور کامل بارگذاری بکنه ، اونرو در Client Side توسط جاوا اسکریپت ایجاد کنیم و به این روش هیچ تصویری برای ایجاد اون دکمه از سرور بارگذاری نمیشه.مثلا از طریق دستورات زیر میتونید یک تصویر در سمت کاربر ایجاد کنید:

document.open("image/gif");
...................
...................
document.write(gifImageData);
document.close();

یکی دیگه از راهکارهای کاهش درخواستها ، استفاده از CSS ها بصورت inline هست.یعنی تا حد امکان از نوشتن CSS ها در قالب یک فایل جداگانه خودداری کنید چراکه اینکار تعداد درخواست به سمت سرویس دهنده را افزایش می دهد.البته این موضوع ، مطلق نیست.مثلا وقتی شما چند پرونده CSS جداگانه دارید ، بهتر هست که اونها رو یکی کنید و اگر حجم این CSS بالا است ، قراردادن کل اون در صفحه HTML عاقلانه نیست.
2-استفاده از HTTP Compression: این روش ، مکانیزمی برای کاهش حجم اطلاعات مبادله شده بین شما و سرویس دهنده است.این امکان توسط همه براوزرها و وب سرور ها پشتیبانی شده و تا 50% میتواند باعث افزایش کارایی بشه.توجه داشته باشید ، این امکان باید در وب سرور شما فعال شده باشه.
3- انتخاب قالب گرافیکی مناسب: بسیاری از توسعه دهندگان ، برای صفحات وب ساخته شده ، از تصاویر موجود و دم دست خودشون بصورت تصادفی و تنها با رعایت مناسب بودن تصویر با نوع استفاده ، استفاده می کنند و توجهی به قالب پرونده ندارند.توجه داشته باشید که اگر تصویر رو برای background یک صفحه یا سلول استفاده می کنید حتما از قالب JPG/JPEG استفاده کنید ، ولی اگر از تصویر برای دکمه ها استفاده می کنید ، قالب مناسب اینکار PNG هست.

4- فشرده سازی CSS ها ، جاوا اسکریپتها و تصاویر: بسیاری از پرونده های CSS و جاوااسکریپتها JS دارای فاصله های خالی ، توضیحات و … هستند که تنها حجم پرونده رو افزایش می دهند.سعی کنید از برنامه های کاربردی مناسب جهت کاهش حجم اونها استفاده کنید.برخی از نمونه این برنامه ها عبارتند از:
PNG
JPG
CSS
CSS
CSS
JS
JS
JS
5- محل CSS ها: تمامی لینک به پرونده های CSS را در محل Head یا همان ابتدای صفحه قرار دهید.
6- محل جاوااسکریپتها: سعی کنید حتی الامکان جاوااسکریپتهای صفحه رو در آخرین قسمت صفحه بگذارید.مثلا پیش از تگ انتهایی body.اینکار زمان انتظار صفحه برای بارگذاری رو برای کاربر کاهش می دهد.
7- استفاده از CDN ها: سعی کنید هاستینگ وب سایت خودتونرو توسط شرکتهایی انجام بدید که Content Delivery Network هستن و یا اونرو در اختیار دارند.زمانیکه شما یک URL یا URI رو تایپ می کنید ، درخواست شما از روترها و رایانه های بسیاری عبور میکنه تا به سرور مقصد برسه و راه برگشت هم از تعداد زیادی از اونها باید عبور بکنه و نهایتا مسیر درازی رو بره.CDN ها ، اطلاعات سایت رو در سرورهای متعددی در نقاط مختلف دنیا بطور همزمان نگهداری می کنند و بعنوان مثال ، وقتی شما در ایران هستید ممکنه سروری که به شما پاسخ میده در ترکیه باشه اما وقتی در امریکا کاربری سایت شما رو درخواست میکنه ، سروری در امریکا بهش پاسخ میده.در انتخاب هاستینگ دقت کنید.
8- با حفظ ملاحظات و نقاط ضعف فن آوری AJAX ، در مواقع لزوم از اون استفاده کنید.خاصیت refresh نسبی صفحه ، باعث میشه که مقدار اطلاعات مبادله شده با سرور کاهش پیدا بکنه و در نتیجه سرعت صفحه وب افزایش خواهد یافت.
9- کاهش اندازه Cookie: همانطور که میدونید Cookie ها جهت ذخیره اطلاعات کاربر در سمت سرویس گیرنده استفاده میشه.سعی کنید تنها اطلاعات لازم رو در اون نگهداری کنید.اینکار علاوه بر کاهش حجم کوکی ، باعث افزایش ضریب امنیت شما هم میشود.
10- استفاده از نهانگاه :سعی کنید در صورت امکان از Cache استفاده کنید.استفاده درست از اون میتونه در افزایش سرعت سایت بسیار موثر باشه.چند مقاله زیر رو برای آشنایی با روشهای مختلف Cache پیشنهاد می کنم:
Static Full Page Caching
Partial Page Caching
Partial Page Caching
dynamic data with dependency

11- ذخیره پرونده های ترجمه شده یا Compiled Code بجای Source Code.بسیاری از برنامه نویسان ، بجای اونکه برنامه رو کامپایل کرده و پرونده مثلا dll در asp.net رو upload کنند ، کل پرونده های منبع یعنی aspx و cs و… رو upload میکنن.اینکار بشدت کارایی سایت رو کاهش میده.
موفق باشید.

۱ دیدگاه »

RSS برای دیدگاه‌های‌ این نوشته. آدرس دنبالک

  1. ممنون
    فوق العاده بود

    :)


دیدگاه‌تان را بنویسید:

XHTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <pre> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

وبلاگ روی وردپرس.کام. | Theme: Pool by Borja Fernandez.
Entries and comments feeds.