| هيلبرنت |
12-03-2016 07:30 PM |
طريقة تسريع الووردبريس بجوجل سبيد google speed من خلال ضغط ملفات CSS & JS
السلام عليكم ورحمة الله وبركاته
كيفكم إخواني
طبعا ً كلنا بنبحث عن تسريع مواقعنا العاملة بسكريبت ووردبريس العالمي
وكل الطرق هي نظام إضافات ممكن تكون شغالة او فيها مشاكل
لكن اليوم فيه طريقة نقليل حجم هذه الملفات يدويا عن طريق ضغطها
يعني عنا هذا الكود حجمو 12 كيلو :
كود:
/* jshint loopfunc: true */
// use jQuery and hoverIntent if loaded
if ( typeof(jQuery) != 'undefined' ) {
if ( typeof(jQuery.fn.hoverIntent) == 'undefined' ) {
/* jshint ignore:start */
// hoverIntent v1.8.1 - Copy of wp-includes/js/hoverIntent.min.js
!function(a){a.fn.hoverIntent=function(b,c,d){var e={interval:100,sensitivity:6,timeout:0};e="object"==typeof b?a.extend(e,b):a.isFunction(c)?a.extend(e,{over:b,out:c,selector:d}):a.extend(e,{over:b,out:b,selector:c});var f,g,h,i,j=function(a){f=a.pageX,g=a.pageY},k=function(b,c){return c.hoverIntent_t=clearTimeout(c.hoverIntent_t),Math.sqrt((h-f)*(h-f)+(i-g)*(i-g))<e.sensitivity?(a(c).off("mousemove.hoverIntent",j),c.hoverIntent_s=!0,e.over.apply(c,[b])):(h=f,i=g,c.hoverIntent_t=setTimeout(function(){k(b,c)},e.interval),void 0)},l=function(a,b){return b.hoverIntent_t=clearTimeout(b.hoverIntent_t),b.hoverIntent_s=!1,e.out.apply(b,[a])},m=function(b){var c=a.extend({},b),d=this;d.hoverIntent_t&&(d.hoverIntent_t=clearTimeout(d.hoverIntent_t)),"mouseenter"===b.type?(h=c.pageX,i=c.pageY,a(d).on("mousemove.hoverIntent",j),d.hoverIntent_s||(d.hoverIntent_t=setTimeout(function(){k(c,d)},e.interval))):(a(d).off("mousemove.hoverIntent",j),d.hoverIntent_s&&(d.hoverIntent_t=setTimeout(function(){l(c,d)},e.timeout)))};return this.on({"mouseenter.hoverIntent":m,"mouseleave.hoverIntent":m},e.selector)}}(jQuery);
/* jshint ignore:end */
}
jQuery(document).ready(function($){
var adminbar = $('#wpadminbar'), refresh, touchOpen, touchClose, disableHoverIntent = false;
refresh = function(i, el){ // force the browser to refresh the tabbing index
var node = $(el), tab = node.attr('tabindex');
if ( tab )
node.attr('tabindex', '0').attr('tabindex', tab);
};
touchOpen = function(unbind) {
adminbar.find('li.menupop').on('click.wp-mobile-hover', function(e) {
var el = $(this);
if ( el.parent().is('#wp-admin-bar-root-default') && !el.hasClass('hover') ) {
e.preventDefault();
adminbar.find('li.menupop.hover').removeClass('hover');
el.addClass('hover');
} else if ( !el.hasClass('hover') ) {
e.stopPropagation();
e.preventDefault();
el.addClass('hover');
} else if ( ! $( e.target ).closest( 'div' ).hasClass( 'ab-sub-wrapper' ) ) {
// We're dealing with an already-touch-opened menu genericon (we know el.hasClass('hover')),
// so close it on a second tap and prevent propag and defaults. See #29906
e.stopPropagation();
e.preventDefault();
el.removeClass('hover');
}
if ( unbind ) {
$('li.menupop').off('click.wp-mobile-hover');
disableHoverIntent = false;
}
});
};
touchClose = function() {
var mobileEvent = /Mobile\/.+Safari/.test(navigator.userAgent) ? 'touchstart' : 'click';
// close any open drop-downs when the click/touch is not on the toolbar
$(document.body).on( mobileEvent+'.wp-mobile-hover', function(e) {
if ( !$(e.target).closest('#wpadminbar').length )
adminbar.find('li.menupop.hover').removeClass('hover');
});
};
adminbar.removeClass('nojq').removeClass('nojs');
if ( 'ontouchstart' in window ) {
adminbar.on('touchstart', function(){
touchOpen(true);
disableHoverIntent = true;
});
touchClose();
} else if ( /IEMobile\/[1-9]/.test(navigator.userAgent) ) {
touchOpen();
touchClose();
}
adminbar.find('li.menupop').hoverIntent({
over: function() {
if ( disableHoverIntent )
return;
$(this).addClass('hover');
},
out: function() {
if ( disableHoverIntent )
return;
$(this).removeClass('hover');
},
timeout: 180,
sensitivity: 7,
interval: 100
});
if ( window.location.hash )
window.scrollBy( 0, -32 );
$('#wp-admin-bar-get-shortlink').click(function(e){
e.preventDefault();
$(this).addClass('selected').children('.shortlink-input').blur(function(){
$(this).parents('#wp-admin-bar-get-shortlink').removeClass('selected');
}).focus().select();
});
$('#wpadminbar li.menupop > .ab-item').bind('keydown.adminbar', function(e){
if ( e.which != 13 )
return;
var target = $(e.target),
wrap = target.closest('.ab-sub-wrapper'),
parentHasHover = target.parent().hasClass('hover');
e.stopPropagation();
e.preventDefault();
if ( !wrap.length )
wrap = $('#wpadminbar .quicklinks');
wrap.find('.menupop').removeClass('hover');
if ( ! parentHasHover ) {
target.parent().toggleClass('hover');
}
target.siblings('.ab-sub-wrapper').find('.ab-item').each(refresh);
}).each(refresh);
$('#wpadminbar .ab-item').bind('keydown.adminbar', function(e){
if ( e.which != 27 )
return;
var target = $(e.target);
e.stopPropagation();
e.preventDefault();
target.closest('.hover').removeClass('hover').children('.ab-item').focus();
target.siblings('.ab-sub-wrapper').find('.ab-item').each(refresh);
});
adminbar.click( function(e) {
if ( e.target.id != 'wpadminbar' && e.target.id != 'wp-admin-bar-top-secondary' ) {
return;
}
adminbar.find( 'li.menupop.hover' ).removeClass( 'hover' );
$( 'html, body' ).animate( { scrollTop: 0 }, 'fast' );
e.preventDefault();
});
// fix focus bug in WebKit
$('.screen-reader-shortcut').keydown( function(e) {
var id, ua;
if ( 13 != e.which )
return;
id = $( this ).attr( 'href' );
ua = navigator.userAgent.toLowerCase();
if ( ua.indexOf('applewebkit') != -1 && id && id.charAt(0) == '#' ) {
setTimeout(function () {
$(id).focus();
}, 100);
}
});
$( '#adminbar-search' ).on({
focus: function() {
$( '#adminbarsearch' ).addClass( 'adminbar-focused' );
}, blur: function() {
$( '#adminbarsearch' ).removeClass( 'adminbar-focused' );
}
} );
// Empty sessionStorage on logging out
if ( 'sessionStorage' in window ) {
$('#wp-admin-bar-logout a').click( function() {
try {
for ( var key in sessionStorage ) {
if ( key.indexOf('wp-autosave-') != -1 )
sessionStorage.removeItem(key);
}
} catch(e) {}
});
}
if ( navigator.userAgent && document.body.className.indexOf( 'no-font-face' ) === -1 &&
/Android (1.0|1.1|1.5|1.6|2.0|2.1)|Nokia|Opera Mini|w(eb)?OSBrowser|webOS|UCWEB|Windows Phone OS 7|XBLWP7|ZuneWP7|MSIE 7/.test( navigator.userAgent ) ) {
document.body.className += ' no-font-face';
}
});
} else {
(function(d, w) {
var addEvent = function( obj, type, fn ) {
if ( obj.addEventListener )
obj.addEventListener(type, fn, false);
else if ( obj.attachEvent )
obj.attachEvent('on' + type, function() { return fn.call(obj, window.event);});
},
aB, hc = new RegExp('\\bhover\\b', 'g'), q = [],
rselected = new RegExp('\\bselected\\b', 'g'),
/**
* Get the timeout ID of the given element
*/
getTOID = function(el) {
var i = q.length;
while ( i-- ) {
if ( q[i] && el == q[i][1] )
return q[i][0];
}
return false;
},
addHoverClass = function(t) {
var i, id, inA, hovering, ul, li,
ancestors = [],
ancestorLength = 0;
while ( t && t != aB && t != d ) {
if ( 'LI' == t.nodeName.toUpperCase() ) {
ancestors[ ancestors.length ] = t;
id = getTOID(t);
if ( id )
clearTimeout( id );
t.className = t.className ? ( t.className.replace(hc, '') + ' hover' ) : 'hover';
hovering = t;
}
t = t.parentNode;
}
// Remove any selected classes.
if ( hovering && hovering.parentNode ) {
ul = hovering.parentNode;
if ( ul && 'UL' == ul.nodeName.toUpperCase() ) {
i = ul.childNodes.length;
while ( i-- ) {
li = ul.childNodes[i];
if ( li != hovering )
li.className = li.className ? li.className.replace( rselected, '' ) : '';
}
}
}
/* remove the hover class for any objects not in the immediate element's ancestry */
i = q.length;
while ( i-- ) {
inA = false;
ancestorLength = ancestors.length;
while( ancestorLength-- ) {
if ( ancestors[ ancestorLength ] == q[i][1] )
inA = true;
}
if ( ! inA )
q[i][1].className = q[i][1].className ? q[i][1].className.replace(hc, '') : '';
}
},
removeHoverClass = function(t) {
while ( t && t != aB && t != d ) {
if ( 'LI' == t.nodeName.toUpperCase() ) {
(function(t) {
var to = setTimeout(function() {
t.className = t.className ? t.className.replace(hc, '') : '';
}, 500);
q[q.length] = [to, t];
})(t);
}
t = t.parentNode;
}
},
clickShortlink = function(e) {
var i, l, node,
t = e.target || e.srcElement;
// Make t the shortlink menu item, or return.
while ( true ) {
// Check if we've gone past the shortlink node,
// or if the user is clicking on the input.
if ( ! t || t == d || t == aB )
return;
// Check if we've found the shortlink node.
if ( t.id && t.id == 'wp-admin-bar-get-shortlink' )
break;
t = t.parentNode;
}
// IE doesn't support preventDefault, and does support returnValue
if ( e.preventDefault )
e.preventDefault();
e.returnValue = false;
if ( -1 == t.className.indexOf('selected') )
t.className += ' selected';
for ( i = 0, l = t.childNodes.length; i < l; i++ ) {
node = t.childNodes[i];
if ( node.className && -1 != node.className.indexOf('shortlink-input') ) {
node.focus();
node.select();
node.onblur = function() {
t.className = t.className ? t.className.replace( rselected, '' ) : '';
};
break;
}
}
return false;
},
scrollToTop = function(t) {
var distance, speed, step, steps, timer, speed_step;
// Ensure that the #wpadminbar was the target of the click.
if ( t.id != 'wpadminbar' && t.id != 'wp-admin-bar-top-secondary' )
return;
distance = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
if ( distance < 1 )
return;
speed_step = distance > 800 ? 130 : 100;
speed = Math.min( 12, Math.round( distance / speed_step ) );
step = distance > 800 ? Math.round( distance / 30 ) : Math.round( distance / 20 );
steps = [];
timer = 0;
// Animate scrolling to the top of the page by generating steps to
// the top of the page and shifting to each step at a set interval.
while ( distance ) {
distance -= step;
if ( distance < 0 )
distance = 0;
steps.push( distance );
setTimeout( function() {
window.scrollTo( 0, steps.shift() );
}, timer * speed );
timer++;
}
};
addEvent(w, 'load', function() {
aB = d.getElementById('wpadminbar');
if ( d.body && aB ) {
d.body.appendChild( aB );
if ( aB.className )
aB.className = aB.className.replace(/nojs/, '');
addEvent(aB, 'mouseover', function(e) {
addHoverClass( e.target || e.srcElement );
});
addEvent(aB, 'mouseout', function(e) {
removeHoverClass( e.target || e.srcElement );
});
addEvent(aB, 'click', clickShortlink );
addEvent(aB, 'click', function(e) {
scrollToTop( e.target || e.srcElement );
});
addEvent( document.getElementById('wp-admin-bar-logout'), 'click', function() {
if ( 'sessionStorage' in window ) {
try {
for ( var key in sessionStorage ) {
if ( key.indexOf('wp-autosave-') != -1 )
sessionStorage.removeItem(key);
}
} catch(e) {}
}
});
}
if ( w.location.hash )
w.scrollBy(0,-32);
if ( navigator.userAgent && document.body.className.indexOf( 'no-font-face' ) === -1 &&
/Android (1.0|1.1|1.5|1.6|2.0|2.1)|Nokia|Opera Mini|w(eb)?OSBrowser|webOS|UCWEB|Windows Phone OS 7|XBLWP7|ZuneWP7|MSIE 7/.test( navigator.userAgent ) ) {
document.body.className += ' no-font-face';
}
});
})(document, window);
}
لكن بعد ما تم ضغطو صار بالشكل هادا وحجمو 8 كيلو:
كود:
"undefined"!=typeof jQuery?("undefined"==typeof jQuery.fn.hoverIntent&&!function(a){a.fn.hoverIntent=function(b,c,d){var e={interval:100,sensitivity:6,timeout:0};e="object"==typeof b?a.extend(e,b):a.isFunction(c)?a.extend(e,{over:b,out:c,selector:d}):a.extend(e,{over:b,out:b,selector:c});var f,g,h,i,j=function(a){f=a.pageX,g=a.pageY},k=function(b,c){return c.hoverIntent_t=clearTimeout(c.hoverIntent_t),Math.sqrt((h-f)*(h-f)+(i-g)*(i-g))<e.sensitivity?(a(c).off("mousemove.hoverIntent",j),c.hoverIntent_s=!0,e.over.apply(c,[b])):(h=f,i=g,void(c.hoverIntent_t=setTimeout(function(){k(b,c)},e.interval)))},l=function(a,b){return b.hoverIntent_t=clearTimeout(b.hoverIntent_t),b.hoverIntent_s=!1,e.out.apply(b,[a])},m=function(b){var c=a.extend({},b),d=this;d.hoverIntent_t&&(d.hoverIntent_t=clearTimeout(d.hoverIntent_t)),"mouseenter"===b.type?(h=c.pageX,i=c.pageY,a(d).on("mousemove.hoverIntent",j),d.hoverIntent_s||(d.hoverIntent_t=setTimeout(function(){k(c,d)},e.interval))):(a(d).off("mousemove.hoverIntent",j),d.hoverIntent_s&&(d.hoverIntent_t=setTimeout(function(){l(c,d)},e.timeout)))};return this.on({"mouseenter.hoverIntent":m,"mouseleave.hoverIntent":m},e.selector)}}(jQuery),jQuery(document).ready(function(a){var c,d,e,b=a("#wpadminbar"),f=!1;c=function(b,c){var d=a(c),e=d.attr("tabindex");e&&d.attr("tabindex","0").attr("tabindex",e)},d=function(c){b.find("li.menupop").on("click.wp-mobile-hover",function(d){var e=a(this);e.parent().is("#wp-admin-bar-root-default")&&!e.hasClass("hover")?(d.preventDefault(),b.find("li.menupop.hover").removeClass("hover"),e.addClass("hover")):e.hasClass("hover")?a(d.target).closest("div").hasClass("ab-sub-wrapper")||(d.stopPropagation(),d.preventDefault(),e.removeClass("hover")):(d.stopPropagation(),d.preventDefault(),e.addClass("hover")),c&&(a("li.menupop").off("click.wp-mobile-hover"),f=!1)})},e=function(){var c=/Mobile\/.+Safari/.test(navigator.userAgent)?"touchstart":"click";a(document.body).on(c+".wp-mobile-hover",function(c){a(c.target).closest("#wpadminbar").length||b.find("li.menupop.hover").removeClass("hover")})},b.removeClass("nojq").removeClass("nojs"),"ontouchstart"in window?(b.on("touchstart",function(){d(!0),f=!0}),e()):/IEMobile\/[1-9]/.test(navigator.userAgent)&&(d(),e()),b.find("li.menupop").hoverIntent({over:function(){f||a(this).addClass("hover")},out:function(){f||a(this).removeClass("hover")},timeout:180,sensitivity:7,interval:100}),window.location.hash&&window.scrollBy(0,-32),a("#wp-admin-bar-get-shortlink").click(function(b){b.preventDefault(),a(this).addClass("selected").children(".shortlink-input").blur(function(){a(this).parents("#wp-admin-bar-get-shortlink").removeClass("selected")}).focus().select()}),a("#wpadminbar li.menupop > .ab-item").bind("keydown.adminbar",function(b){if(13==b.which){var d=a(b.target),e=d.closest(".ab-sub-wrapper"),f=d.parent().hasClass("hover");b.stopPropagation(),b.preventDefault(),e.length||(e=a("#wpadminbar .quicklinks")),e.find(".menupop").removeClass("hover"),f||d.parent().toggleClass("hover"),d.siblings(".ab-sub-wrapper").find(".ab-item").each(c)}}).each(c),a("#wpadminbar .ab-item").bind("keydown.adminbar",function(b){if(27==b.which){var d=a(b.target);b.stopPropagation(),b.preventDefault(),d.closest(".hover").removeClass("hover").children(".ab-item").focus(),d.siblings(".ab-sub-wrapper").find(".ab-item").each(c)}}),b.click(function(c){("wpadminbar"==c.target.id||"wp-admin-bar-top-secondary"==c.target.id)&&(b.find("li.menupop.hover").removeClass("hover"),a("html, body").animate({scrollTop:0},"fast"),c.preventDefault())}),a(".screen-reader-shortcut").keydown(function(b){var c,d;13==b.which&&(c=a(this).attr("href"),d=navigator.userAgent.toLowerCase(),-1!=d.indexOf("applewebkit")&&c&&"#"==c.charAt(0)&&setTimeout(function(){a(c).focus()},100))}),a("#adminbar-search").on({focus:function(){a("#adminbarsearch").addClass("adminbar-focused")},blur:function(){a("#adminbarsearch").removeClass("adminbar-focused")}}),"sessionStorage"in window&&a("#wp-admin-bar-logout a").click(function(){try{for(var a in sessionStorage)-1!=a.indexOf("wp-autosave-")&&sessionStorage.removeItem(a)}catch(b){}}),navigator.userAgent&&-1===document.body.className.indexOf("no-font-face")&&/Android (1.0|1.1|1.5|1.6|2.0|2.1)|Nokia|Opera Mini|w(eb)?OSBrowser|webOS|UCWEB|Windows Phone OS 7|XBLWP7|ZuneWP7|MSIE 7/.test(navigator.userAgent)&&(document.body.className+=" no-font-face")})):!function(a,b){var d,c=function(a,b,c){a.addEventListener?a.addEventListener(b,c,!1):a.attachEvent&&a.attachEvent("on"+b,function(){return c.call(a,window.event)})},e=new RegExp("\\bhover\\b","g"),f=[],g=new RegExp("\\bselected\\b","g"),h=function(a){for(var b=f.length;b--;)if(f[b]&&a==f[b][1])return f[0];return!1},i=function(b){for(var c,i,j,k,l,m,n=[],o=0;b&&b!=d&&b!=a;)"LI"==b.nodeName.toUpperCase()&&(n[n.length]=b,i=h(b),i&&clearTimeout(i),b.className=b.className?b.className.replace(e,"")+" hover":"hover",k=b),b=b.parentNode;if(k&&k.parentNode&&(l=k.parentNode,l&&"UL"==l.nodeName.toUpperCase()))for(c=l.childNodes.length;c--;)m=l.childNodes[c],m!=k&&(m.className=m.className?m.className.replace(g,""):"");for(c=f.length;c--;){for(j=!1,o=n.length;o--;)n[o]==f[c][1]&&(j=!0);j||(f[c][1].className=f[c][1].className?f[c][1].className.replace(e,""):"")}},j=function(b){for(;b&&b!=d&&b!=a;)"LI"==b.nodeName.toUpperCase()&&!function(a){var b=setTimeout(function(){a.className=a.className?a.className.replace(e,""):""},500);f[f.length]=[b,a]}(b),b=b.parentNode},k=function(b){for(var c,e,f,h=b.target||b.srcElement;;){if(!h||h==a||h==d)return;if(h.id&&"wp-admin-bar-get-shortlink"==h.id)break;h=h.parentNode}for(b.preventDefault&&b.preventDefault(),b.returnValue=!1,-1==h.className.indexOf("selected")&&(h.className+=" selected"),c=0,e=h.childNodes.length;c<e;c++)if(f=h.childNodes[c],f.className&&-1!=f.className.indexOf("shortlink-input")){f.focus(),f.select(),f.onblur=function(){h.className=h.className?h.className.replace(g,""):""};break}return!1},l=function(a){var b,c,d,e,f,g;if(("wpadminbar"==a.id||"wp-admin-bar-top-secondary"==a.id)&&(b=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,!(b<1)))for(g=b>800?130:100,c=Math.min(12,Math.round(b/g)),d=Math.round(b>800?b/30:b/20),e=[],f=0;b;)b-=d,b<0&&(b=0),e.push(b),setTimeout(function(){window.scrollTo(0,e.shift())},f*c),f++};c(b,"load",function(){d=a.getElementById("wpadminbar"),a.body&&d&&(a.body.appendChild(d),d.className&&(d.className=d.className.replace(/nojs/,"")),c(d,"mouseover",function(a){i(a.target||a.srcElement)}),c(d,"mouseout",function(a){j(a.target||a.srcElement)}),c(d,"click",k),c(d,"click",function(a){l(a.target||a.srcElement)}),c(document.getElementById("wp-admin-bar-logout"),"click",function(){if("sessionStorage"in window)try{for(var a in sessionStorage)-1!=a.indexOf("wp-autosave-")&&sessionStorage.removeItem(a)}catch(b){}})),b.location.hash&&b.scrollBy(0,-32),navigator.userAgent&&-1===document.body.className.indexOf("no-font-face")&&/Android (1.0|1.1|1.5|1.6|2.0|2.1)|Nokia|Opera Mini|w(eb)?OSBrowser|webOS|UCWEB|Windows Phone OS 7|XBLWP7|ZuneWP7|MSIE 7/.test(navigator.userAgent)&&(document.body.className+=" no-font-face")})}(document,window);
طبعا تم تخفيف من حجمو 4 كيلو بايت
لو طبقنا الطريقة على 100 ملف من ملفات الجافا سكريبت والـ CSS
بنكون خففنا من حجم الموقع ما يقارب 400 كيلو بايت ويهيك صار تحميل الموقع أسرع للمستخدمين
وهاي الطريقة عن طريق موقع مجاني يضغط هذه الملفات بسهولة
أتمنى أن أكون قد وفقت في هذا الشرح |
