برای بهینه سازی لود صفحات چه کار باید کرد. ؟!

[si6arp]

با سلام.
در سایت هایی کا طراحی کرده ام این مثله خیلی من رو اذیت میکنه ولی خیلی از سایت ها رو میبینم که با حجم دیتا های زیادی ولی با سرعت قابل توجهی لود میشود . کدام یک از موارد زیر باعث سرعت سایت مشود . ؟ لطفا به ترتیب اولویت بگید . ممنون


1 - قالب سایت ( از DIV یا Table استفاده کردن خیلی مهم است ؟ )
2 - برنامه نویسی (بیشتر من دیتا ها رو از XML میخوانم و در دیتاست پر میکنم . آیا این کار درست است یا باید از خود دیتا بیس سلکت کنم ؟ )
3 - Caching ? آیا استفاده از این مورد در لود صفحات تاثیر دارد ؟
4 - سروری که هاست از آن میگیریم ؟ (نسبتا تمام سرور هایی که هاست ویندوز میدن یکی هستند. میشه یک سروری خوب معرفی نمایید )
5 - عکس های استفاده شده در قالب ؟ (پسوند عکس ها هم تاثیر دارد که مثلا" عکس ها JPG , Png . . . باشد ؟ )

اگر موارد دیگری هم هست لطفا تذکر بدید. و بزارید مشکل سرعت لود صفحات را برای همیشه در سایت هایی که طراحی میکنم حل کنم.

[Mostafa_Dindar]

1 - قالب سایت ( از DIV یا Table استفاده کردن خیلی مهم است ؟ )

استفاده از Div تگها و CSS به صورت مستقیم تاثیری در سرعت لود صفحه ندارند . استفاده از Table ها تو در تو باعث درگیر کردن پردازنده Client و گاها Crash کردن مرورگر میشه . درحالی که داده های درون این Table ها بارگزاری شده , ولی تا زمانی که مروگر Client جدولها رو به طور کامل Interpret یا تفسیر نکند , داده ها نمایش داده نمیشود .

گاها صفحاتی رو میبینید که داده های اون نمایش داده نمیشه , و یکدفعه داده های اون گرومپ !!! ظاهر میشه . علت به خاطر استفاده کردنهای پیش از اندازه تو در تو در Layout صفحات است .
به طور کلی پیشنهاد شده تنها برای نمایش داده های Tabular از Table استفاده کنید و در صورتی که برای Layout از جدول استفاده کنید به خاطر داشته باشید که بیش از 3 جدول تو در تو استفاده نکنید .

پس استفاده کردن کمتر از 3 جدول تو در تو تاثیری در سرعت لود صفحات ندارد و تنها شما قابلیتهای بیشمار CSS رو از دست میدین .

2 - برنامه نویسی (بیشتر من دیتا ها رو از XML میخوانم و در دیتاست پر میکنم . آیا این کار درست است یا باید از خود دیتا بیس سلکت کنم ؟ )

به طور کلی سرعت دسترسی به داده از SQL بسیار بیشتر از سرعت داده های NTFS هست . حال میخواهد فایل XML باشد , یا عکس , یا هر فایل دیگه که در Hard Disk ذخیره میشه .

3 - Caching ? آیا استفاده از این مورد در لود صفحات تاثیر دارد ؟

Stephan Walter جمله جالبی داره , ایشون در کتابشون میگه :

If someone put a gun to my head and told me that I had 5 minutes to improve the performance of a website, then I would immediately think of caching. By taking advantage of caching, you can dramatically improve the performance
of your web applications.

البته Caching انواع متفاوت دارد و در سطوح متفاوت پیاده سازی میشود که باید متناسب با نیازتون از اون استفاده کنید .

4 - سروری که هاست از آن میگیریم ؟ (نسبتا تمام سرور هایی که هاست ویندوز میدن یکی هستند. میشه یک سروری خوب معرفی نمایید )

انتخاب Host هم در سرعت وب سایت شما تاثیر نسبتا زیادی دارد . من یک نسخه از DotNetNuke رو در چند سرور متفاوت نصب کردم و تفاوتها بسیار زیاد بودند .

5 - عکس های استفاده شده در قالب ؟ (پسوند عکس ها هم تاثیر دارد که مثلا" عکس ها JPG , Png . . . باشد ؟ )

عکسها باید تا حد امکان فشرده شده باشند . سعی کنید عکسها رو با استفاده از PhotoShop به کمترین حجم خودش برسونید .

انتخاب فرمت فایل برای کاهش حجم بسیار مهم است . مثلا در صورتی که عکس شما از تنوع رنگی کمی برخوردار هست , بهترین انتخاب Gif هست , شما میتونید تعداد رنگهای اون رو کاهش بدید و به شدت حجم اون رو کم کنید .
در صورتی که تنوع رنگی زیاد هست , JPEG انتخاب خوبی هست , کیفیت عکس رو بر روی 50 بزارید و در صورتی که اندازه طول و عرض عکس زیاد است گزینه های Interlaced و Progressive رو انتخاب کنید .( دلیلش رو حتما میدونید )
در صورتی که میخواهید عکس Transparent با کیفیت باشد چاره ای نیست که PNG24 انتخاب کنید .

// نا گفته نماند که برای تبدیل عکسها در فتوشاپ گزینه Save For Web Pages رو از منوی فایل انتخاب کنید

اگر موارد دیگری هم هست لطفا تذکر بدید. و بزارید مشکل سرعت لود صفحات را برای همیشه در سایت هایی که طراحی میکنم حل کنم.

موارد بسیار دیگری هست هست که هر کدام تا حدودی نقش خود رو خواهند داشت .

در صورتی که از Adobe Flash در صفحاتتون استفاده میکنید , دهها تکنیک هست که میتونید سرعت لود صفحه رو افزایش بدید .

از Hit کردن های بیمورد دیتابیس جلوگیری کنید , خیلی از سایتهای دیتابیسشون بیشتر شبیه به OLAP هست تا OLTP . پس دلیلی ندارد که هر دفعه دیتابیس Hitشود .

سعی کنید تنها از یک Connection String استفاده کنید ( یعنی یکجا اون رو در وب کانفیک ذخیره کنید و اون رو فراخوانی کنید ) , این به POOL کردن Connection شما بسیار کمک خواهد کرد .

اگر ترافیک سایتتون بالاست , و در صورتی که به ADO کاملا مسلط نیستید از فضای نام Microsoft.ApplicationBlocks.Data استفاده کنید . سایت اکثر بچه های کم تجربه در صورتی که بار ترافیکی زیادی داشته باشد خطای Connection Pooling خواهد داد . ولی در صورتی که از فضای نام بالا استفاده کنید تا حد زیادی از آن جلوگیری خواهید کرد . ضمن اینکه زمان Development کردن پروژه تان را هم کم میکنید .


موفق باشید .

[Behrouz_Rad]

let's begin

1 - قالب سایت ( از DIV یا Table استفاده کردن خیلی مهم است ؟ )

دو تا از دلایل برتری div نسبت به table که معمولاً افراد ازش غافل هستند:
1) یکی از فاکتورهای مهم برای افزایش رتبه در موتورهای جستجو، هر چه نزدیک تر بودن کلمات کلیدی سایت به ابتدای محتویات سایت هست. با Table این کار امکان پذیر نیست. با div هست.
2) بحثی با نام performance perspective داریم که مشخص کننده نحوه ی تعامل "دیداری" کاربر با سایت هست. در حقیقت نوعی گول زدن کاربر برای القای افزایش سرعت load صفحه هست. با div می تونید این کار رو انجام بدید. اگر یک قالب سه ستونه با استفاده از Table داشته باشید و محتویات سایت در ستون وسط باشه، ابتدا باید ستون سمت چپ load باشه. اگر حجم داده های ستون سمت چپ زیاد باشه، کاربر محتویات اصلی که در حقیقت نقطه ی جذاب load صفحه است رو دیر می بینه. با div می تونید ترتیب نمایش و بارگزاری اطلاعات صفحه رو خودتون تعیین کنید.

2 - برنامه نویسی (بیشتر من دیتا ها رو از XML میخوانم و در دیتاست پر میکنم . آیا این کار درست است یا باید از خود دیتا بیس سلکت کنم ؟ )

مشخص نکردید که این نوع داده ها چی هستند اما فایل XML عمدتاً برای نگهداری تنظیمات برنامه و Localization استفاده میشن. خوندن و نوشتن حجم زیادی از داده ها از/به فایل، سرعت عملیات و بالطبع برنامه رو کاهش میده. داده های اصلی پروژه باید در Database نگهداری بشن.

3 - Caching ? آیا استفاده از این مورد در لود صفحات تاثیر دارد ؟

بسیار بسیار زیاد. Caching مقوله ای هست که متاسفانه مظلوم واقع شده اما مبحث گسترده و بسیار کاربردی هست. در IIS 7.0 پیشرفت های بسیار خوبی برای Caching محتویات Static و Dynamic صورت پذیرفته.

4 - سروری که هاست از آن میگیریم ؟ (نسبتا تمام سرور هایی که هاست ویندوز میدن یکی هستند. میشه یک سروری خوب معرفی نمایید )

بله Server بسیار نقش مهمی داره. اجزای سخت افزاری Server، سرعت اتصال به اینترنت Server، میزان زمان برای برقراری اتصال و سرعت پاسخگویی Server. در مورد Host مناسب زیاد بحث شده. جستجو کنید.

5 - عکس های استفاده شده در قالب ؟ (پسوند عکس ها هم تاثیر دارد که مثلا" عکس ها JPG , Png . . . باشد ؟ )

برای بهینه سازی حجم تصاویر، Photoshop بهترین ابزار هست. از منوی File گزینه ی Save for web رو انتخاب و حالت های مختلف رو بررسی کن.

موفق باشید.

[si6arp]

با تشکر از دوستان خوبم Mostafa_Dindar و آقای Behrouz_Rad
مرسی از مطالب خوب و کارآمدتیون
پس تا اینجای کار نتیجه میگیریم که :
1- سرعت لود دیتا از XML پایینتر از سلکت زدن به دیتابیس هست.(پس سلکت زدن به دیتابیس منطقی تره و سرعت بهتری داره ) *یک سری دیتا مثل تبلیغات هر کاربر.**من بجر اینکه دیتا رو در دیتابیس ذخیره میکنم در فایل XML هم ذخیره میکنم و برای نمایش از فایل XML استفاده میکنم. مثل اینکه این کار زیاد درست نیست. نه ؟
2 - استفاده از DIV منطقی تر از Table هست ( تیبل فقط برای جدول بندی های خواص است ) (ازتون خواهش میکنم اگه راهنمایی دارید برای استفاده و نکات DIV بهم معرفی نمایید - PDF )
در موارد دیگر هم که کاملا باهاتون موافقم
و اما کشینگ :
دیتا هایی که من سلکت میکنم و نمایش میدهم بر اساس تاریخ انقضای مطلب هست . یعنی هر مطلب یک تاریخ انقضا داره که اگه گذشته باشه دیگه نباید نمایش داده بشه . پس نمیتونم در این مورد از کشینگ استفاده نمایم. آیا شما هم نظری در این باره دارید ؟

[Behrouz_Rad]

دیتا هایی که من سلکت میکنم و نمایش میدهم بر اساس تاریخ انقضای مطلب هست . یعنی هر مطلب یک تاریخ انقضا داره که اگه گذشته باشه دیگه نباید نمایش داده بشه . پس نمیتونم در این مورد از کشینگ استفاده نمایم. آیا شما هم نظری در این باره دارید ؟

مقدار خصیصه ی VaryByParam دایرکتیو OutputCache رو برابر با نام Query String بگذار.

موفق باشید.

[Modifier]

به طور کلی پیشنهاد شده تنها برای نمایش داده های Tabular از Table استفاده کنید

داده هاي Tabular چي هست؟

[Mostafa_Dindar]

داده هاي Tabular چي هست؟

داده هایی که ذاتا به صورت جدولی هستند مثل داده های داخل دیتابیس . هنگامی که داده های داخل دیتابیس را به کنترلهای داده مثل GridView بایند میکنید , کنترل GridView آنها را به صورت جدولی نمایش میدهد.

[Modifier]

داده هایی که ذاتا به صورت جدولی هستند مثل داده های داخل دیتابیس . هنگامی که داده های داخل دیتابیس را به کنترلهای داده مثل GridView بایند میکنید , کنترل GridView آنها را به صورت جدولی نمایش میدهد.

خب اينكه عملا دست ما نيست ... چون ما فقط بايند ميكنيم و هنگام نمايش به فرم Html در ميآيد...
پس يعني خودمان هيچ گاه به صورت دستي از Table استفاده نكنيم؟!

اگر اينطور هست چرا مايكروسافت توي VS گزينه Insert Table رو گذاشته ولي چيزي به نام Insert Div نداريم ؟

[ricky22]

خب اينكه عملا دست ما نيست ... چون ما فقط بايند ميكنيم و هنگام نمايش به فرم Html در ميآيد...
پس يعني خودمان هيچ گاه به صورت دستي از Table استفاده نكنيم؟!

اگر اينطور هست چرا مايكروسافت توي VS گزينه Insert Table رو گذاشته ولي چيزي به نام Insert Div نداريم ؟

شاید چون برای DIV نیاز به کد نویسی زیاد نیست
هر چند DIV در Toolbox قرار داره

[Modifier]

شاید چون برای DIV نیاز به کد نویسی زیاد نیست
هر چند DIV در Toolbox قرار داره

شايد توي DesignMode زياد كد Html نخواد ولي بايد يه گوني Css براش تعريف كرد تا اوني كه ميخواي بشه...

فرض كن يه جدول n*n بخواي چقدر خوب بود كه Div چنين امكاني داشت...
تازه دردسر اونجاست كه وسط كار بخواي چندجا رو Merge كني يا spilt...انوقت توي Css ها گم ميشي...

[Modifier]

آیا بهتر نیست صفحه رو هم با Div ساخت و هم با Table .. یا باید همه رو با Div ساخت ؟
چی پیشنهاد میکنید؟

مطلب زیر رو هم توضیح بدین لطفا ..

داده هایی که ذاتا به صورت جدولی هستند مثل داده های داخل دیتابیس . هنگامی که داده های داخل دیتابیس را به کنترلهای داده مثل GridView بایند میکنید , کنترل GridView آنها را به صورت جدولی نمایش میدهد.

خب اينكه عملا دست ما نيست ... چون ما فقط بايند ميكنيم و هنگام نمايش به فرم Html در ميآيد...
پس يعني خودمان هيچ گاه به صورت دستي از Table استفاده نكنيم؟!