افزایش سرعت وب سایت

[soroush.r70]

وب سایتی در دست ساخت دارم که دارای عکس زیاد و فایل های حجیم هست علاوه بر کم حجم کردن تصویر با نرم افزار , با استفاده از اسکریپت و برنامه نویسی چه راهی پیشنهاد می کنید تا سر عت وب سایت افزایش پیدا کنه تا این تصاویر و فایل ها تاثیر زیادی در سرعت نداشته باشد...؟

[Reza1607]

اگه سايتت گالري هست يعني عكس هاي كه ميگي تنها براي قالب نيست از lazyload‏ استفاده كن

[soroush.r70]

به چه صورت می تونی راهنمایی کنی هم برای قالب تصویر دارم و هم برای در واقع گالری می تونی راهنمایی کنی...؟

[saadatieathar]

با فعال کردن Gzip هم می تونی سرعت رو افزایش بدی!

http://weblogina.com/article/how-to-optimize-your-site-with-gzip-compression/

[soroush.r70]

از lazyload‏ چطور استفاده کنم

[soroush.r70]

کسی استفاده از lazyload‏ رو بلده...؟

[soroush.r70]

رفتم دنبال lazyload و پیداش کردم اینجا می ذارم تا دوست دارین استفاده کنید کافیه فقط کد زیر را در اول صفحه سایت کپی کنید.


<script type="text/javascript" src="js/mootools-1.2.4.js"></script>
<script type="text/javascript">
var LazyLoad = new Class({
Implements: [Options,Events],
/* additional options */
options: {
range: 200,
image: 'images/blank.gif',
resetDimensions: true,
elements: 'img',
container: window,
fireScroll: true, /* keeping for legacy */
mode: 'vertical',
startPosition: 0
},
/* initialize */
initialize: function(options) {
/* vars */
this.setOptions(options);
this.container = document.id(this.options.container);
this.elements = $$(this.options.elements);
var axis = (this.options.mode == 'vertical' ? 'y': 'x');
this.containerDimension = this.container.getSize()[axis];
this.startPosition = 0;

/* find elements remember and hold on to */
this.elements = this.elements.filter(function(el,i) {
/* reset image src IF the image is below the fold and range */
if(el.getPosition(this.container)[axis] > this.containerDimension + this.options.range) {
el.store('oSRC',el.get('src')).set('src',this.opti ons.image);
if(this.options.resetDimensions) {
el.store('oWidth',el.get('width')).store('oHeight' ,el.get('height')).set({'width':'','height':''});
}
return true;
}
},this);

/* create the action function */
var action = function() {
var cpos = this.container.getScroll()[axis];
if(cpos > this.startPosition) {
this.elements = this.elements.filter(function(el) {
if((cpos + this.options.range + this.containerDimension) >= el.getPosition(this.container)[axis]) {

if(el.retrieve('oSRC')) { el.set('src',el.retrieve('oSRC')); }
if(this.options.resetDimensions) {
el.set({ width: el.retrieve('oWidth'), height: el.retrieve('oHeight') });
}
this.fireEvent('load',[el]);
return false;
}
return true;
},this);
this.startPosition = cpos;
}
this.fireEvent('scroll');
/* remove this event IF no elements */
if(!this.elements.length) {
this.container.removeEvent('scroll',action);
this.fireEvent('complete');
}
}.bind(this);

/* listen for scroll */
this.container.addEvent('scroll',action);
if(this.options.fireScroll) { action(); }
}
});
/* do it! */
window.addEvent('domready',function() {
var lazyloader = new LazyLoad({
onLoad: function(img) {
setTimeout(function(){img.setStyle('opacity',0).fa de(1);},500);
}
});
});
</script>



این فایل mootools هم داخل اینترنت هست می تونین گیر بیارین