نقطه ویرگول;

هر از گاهی از هر چیزی

هر از گاهی از هر چیزی

مقدمه:
این روزها با قابلیت اتصال به اینترنتهای پر سرعت دیگر لازم نیست نگران  سرعت اینترنت ،اندازه فایلها و صفحات باشیم.
با این حال نباید گفت که نیازی به سرعت بخشیدن به سایتمان نیست.اگر خواستار کاهش بار از روی سرور ،همچنان کاهش تعداد درخواستهای HTTP و افزایش تعداد بازدیدکننده ها هستید.چند تکنیک وجود دارد که می توانید از آنها استفاده کنید.این مقاله تعدادی از فوت و فن های  PHP نظیر فشرده سازی و caching رو پوشش میدهد.

1-ادغام CSS  با PHP
به عنوان توسعه دهندگان وب،ما اغلب CSS را بین چندین فایل جداگانه به عنوان یک تفکیک منطقی و ایجاد تغییرات راحتر  نگه داری میکنیم.با این حال،افزایش  تعداد درخواستها از سرور باعث کند تر شدن بارگذاری صفحات میشود.با استفاده از PHP ما میتوانیم دو حالت بسیار خوب داشته باشیم; نگهداری چندین فایل و استفاده از یک درخواست برای بازیابی همه ی آنها.

شروع به کار:
قبل از اینکه ما بتوانیم فایل CSS رو بهینه کنیم ، ما  به تعدادی فایل CSS برای کار کردن نیاز خواهیم داشت.بنابراین اجازه دهید تا سه فایل CSS ایجاد کنیم و کدهای CSS زیر را در آنها قرار دهیم.
// main.css
// Just some sample CSS
body {
width: 800px;
margin: 0 auto;
color: grey;
}
#wrapper {
margin-top: 30px;
background: url(../images/cats.png);
}
// typography.css
// Just some sample CSS
body {
font-family: Arial, san-serif;
font-weight: bold;
}
strong {
font-size: 120%;
}
// forms.css
// Just some sample CSS
form {
position: relative;
top: 400px;
z-index: 99;
}
input {
height: 50px;
width: 400px;
}
پی اچ پی
ما نیاز به محتویات این فایل ها و الحاق آنها به یکدیگر در مرحله تعیین شده داریم.کد زیر را دریافت کرده و داخل یک فایل با پسوند php قرار دهید.
<?php
//Lets define some useful variables
// --- NOTE: PATHS NEED TRAILING SLASH ---
if (isset($_GET['q'])) {
$files = $_GET['q'];
// Got the array of files!
//Lets just make sure that the files don't contain any nasty characters.
foreach ($files as $key => $file) {
$files[$key] = str_replace(array('/', '\', '.'), '', $file);
}
$cssData = '';
foreach ($files as $file) {
$cssFileName = $cssPath . $file . '.css';
$fileHandle = fopen($cssFileName, 'r');
$cssData .= "n" . fread($fileHandle, filesize($cssFileName));
fclose($fileHandle);
}
}
// Tell the browser that we have a CSS file and send the data.
header("Content-type: text/css");
if (isset($cssData)) {
echo $cssData;
echo "nn// Generated: " . date("r");
} else {
echo "// Files not avalable or no files specified.";
}
?>
فرار از down شدن
چنین به نظر می رسد که این کار، امری پیچده است،اما اگر با من تا آخر همراهی کنید خواهید دید واقعا خیلی سادست.
<?php
//Lets define some usefull variables
// --- NOTE: PATHS NEED TRAILING SLASH ---
$cssPath = './css/';
if (isset($_GET['q'])) {
$files = $_GET['q'];
// Got the array of files!
//Lets just make sure that the files don't contain any nasty charactors.
foreach ($files as $key => $file) {
$files[$key] = str_replace(array('/', '\', '.'), '', $file);
}
این تکه  کد مسیر پوشه css  را تنظیم و بررسی میکند که ما فایلی برای کار کردن داریم یا نه.مسیر CSS نیاز به یک بک اسلش دارد در غیر اینصورت ما خودمان را در دریایی از خطاهای بارگذاری (Load) خواهیم یافت.اگر ما بخواهیم می توانستیم به صورت خودکار بررسی کنیم و یک اسلش "/" در صورت نیاز اضافه شود.با این حال به خاطر سادگی این کار را حذف کردم.
سپس ما نام هر فایل و رفع هر گونه مشکل و اسلش "/" را بررسی میکنیم.این امر موجب ممانعت افراد از مرور فایل سیستم توسط درخواست نام پرونده ها نظیر '../../secret/file' میشود.
$cssData = '';
foreach ($files as $file) {
$cssFileName = $cssPath . $file . '.css';
$fileHandle = fopen($cssFileName, 'r');
$cssData .= "n" . fread($fileHandle, filesize($cssFileName));
fclose($fileHandle);
}

حال ما داده های css در داخل یک فایل یکتا داریم.برای این کار ما از طریق حلقه foreach فایلها رو آرایه کردیم ،هر فایل رو باز و به داده هایمان الحاق کردیم. عملگر "n" به سادگی یک خط جدید برای حفظ ترتیب و تمیزی کد ایجاد میکند.تابع filesize() برای یافتن طول و اندازه فایل استفاده شده همچنان که ما می توانیم بگوییم fread() چه مقدار نیاز داریم.(فایلهای بی نقص).
// Tell the browser that we have a CSS file and send the data.
header("Content-type: text/css");
if (isset($cssData)) {
echo $cssData;
echo "nn// Generated: " . date("r");
} else {
echo "// Files not avalable or no files specified.";
}
?>
آخرین مرحله از کار فرستادن داده های CSS  به مرورگر است.این بدان معانست که ما داریم به PHP دستور میدهیم که ما داده های CSS را فرستادیم،و اینکه آن باید مرورگر را از این امر آگاه سازد.ما این کار را با تابع header انجام میدیم.نوع محتوا را به text/css تنظیم میکنیم.سپس ما css را به کلاینت ارسال میکنیم. ابتدا چک میکنیم که داده های CSSای برای ارسال وجود دارد یا خیر.اگر وجود نداشت  یعنی هیچ فایل css ای برای ارسال وجود نداشته.اگر ما داده ای  برای ارسال داشته باشیم پس ما آنها را ارسال میکنیم و یک پیغام با شرح در آن هنگام تولید میشود.برای مثال اگر شما بخواهید اطلاعات کپی رایتتان را در  تمامی CSS تان داشته باشید این مورد بهترین مکان خواهد بود.
تست کار:
بسیار خب ، زمان ان رسیده است که این اسکریپت را امتحان کنیم.در ابتدا نیاز داریم یه دایرکتوری بسازیم و اسکریپت و css هایمان را در آنجا قرار دهیم.عکس زیر ساختار مدنظر من را بازگو میکند.اگر شما میخواهید می تونید هر طوری که خواستین عمل کنید ولی فراموش نکنید که باد مسیرهاتون رو تغییر بدید.

هنگامیکه همه چیز در جای درست خودش قرار گرقت میتونیم اسکریپت رو امتحان کنیم.دایرکتوری ما در داخل پوشه htpdocs یا www  از یک وب سرور PHP خواهد بود(امروزه وب سرور های فراوانی وجود دارند)
بیاید یک کلک رو امتحان کنیم.اگر index.php?q[]=main را تایپ کنید شما باید محتوای فایل main.css رو همراه با جزئیات و نکته ها در پایین آن ببینید.
اگر ما بخواهیم چندین فایل جداگانه رو داخل هم قرار بدیم(این اسکریپت واقعا یک روش خوب می باشد).ما میتوانیم درخواست رو به سرور ارسال کنیم: 'index.php?q[]=main&q[]=forms'.همانطور که می بینید میتوانیم درخواست  'q[]=' هر چند بار که میخواهیم تکرار کنیم.شما  میتونید 50 فایل css رو با استفاده از این اسکریپت بخونید و استفاده کنید.

نتیجه:
استفاده از این روش می تواند بسیار کارآمد باشد و میتواند منفعت های بسیاری را فراهم آورد
برای مثال:قادر خواهیم بود یک شیوه نامه(style sheet) پیش فرض برای تمامی صفحات داشته باشیم.اگر شما بخواهید حتی می توانید  فایل index.php را به index.css تغییر نام دهید و .htaccess  را طوری تنظیم کنید که با css رفتاری شبیه php داشته باشد.
ادامه دارد....
موافقین ۰ مخالفین ۰ ۸۹/۰۸/۲۹
مرتضی فتحی

سرعت

php

نظرات  (۲)

۱۵ دی ۹۰ ، ۰۱:۲۶ وحید چکشی
combine کردن فایلهای css طرح خیلی خوبیه ولی به نظر من سایتهایی که ویزیت بالایی ندارن نیاز به این کار ندارن و سایتهایی که ویزیت بالایی دارن این کار باعث میشه که داپم لود فایلها رو داشته باشن مگر اینکه خروجی اسکریپت روی سرور کش بشه.
من این کار روی سایتی که 120 ویزیت در روز داشت تست کردم.
cacti بهم نشون داد که بدون کش کردن خوندن از روی هارد وقت بیشتری می گیره.
در کل از مقالتون خیلی استفاده کردم.
موفق باشید.
۱۵ دی ۹۰ ، ۰۱:۲۷ وحید چکشی
منظورم از 120 - 120 هزار بود

ارسال نظر

ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
شما میتوانید از این تگهای html استفاده کنید:
<b> یا <strong>، <em> یا <i>، <u>، <strike> یا <s>، <sup>، <sub>، <blockquote>، <code>، <pre>، <hr>، <br>، <p>، <a href="" title="">، <span style="">، <div align="">
تجدید کد امنیتی