no-emojis - Carlos González Gurrea

Velocidad de carga vs Emojis

Corría el año 2015 cuando WordPress decidió aportar su granito de arena con los Emojis, a día de hoy todo el mundo sabe lo que son pero en aquella época parecía que quedaba bien a todo el mundo, la versión 4.2 de WordPress traía los Emojis instalados por defecto. J = 🙂

Con la lucha de la velocidad de carga de mi página y de la página de clientes, decidí investigar y empecé a navegar por internet en busca de respuestas, mi página con la versión anterior de WordPress llegaba a tardar casi u segundo menos de carga. Este tiempo, aunque parezca un solo segundo es bastante tiempo a la hora de cargar cada una de mis páginas.

Yo no soy partidario de los Emojis, puede que para alguna conversación privada de Telegram, Whatsapp, pero en las páginas de clientes, Web corporativas, Landing page o blogs personales, no lo veo necesario. Además si me incrementa el tiempo de carga en 1 segundo hace que todavía me haga más partidario de eliminarlo.

El código que se genera en nuestro HTML, si mirais vuestra página será similar a este

	<script type="text/javascript">
			window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/2.4\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/2.4\/svg\/","svgExt":".svg","source":{"concatemoji":"https:\/\/www.carlosgonzalezgurrea.es\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.9.5"}};
			!function(a,b,c){function d(a,b){var c=String.fromCharCode;l.clearRect(0,0,k.width,k.height),l.fillText(c.apply(this,a),0,0);var d=k.toDataURL();l.clearRect(0,0,k.width,k.height),l.fillText(c.apply(this,b),0,0);var e=k.toDataURL();return d===e}function e(a){var b;if(!l||!l.fillText)return!1;switch(l.textBaseline="top",l.font="600 32px Arial",a){case"flag":return!(b=d([55356,56826,55356,56819],[55356,56826,8203,55356,56819]))&&(b=d([55356,57332,56128,56423,56128,56418,56128,56421,56128,56430,56128,56423,56128,56447],[55356,57332,8203,56128,56423,8203,56128,56418,8203,56128,56421,8203,56128,56430,8203,56128,56423,8203,56128,56447]),!b);case"emoji":return b=d([55357,56692,8205,9792,65039],[55357,56692,8203,9792,65039]),!b}return!1}function f(a){var c=b.createElement("script");c.src=a,c.defer=c.type="text/javascript",b.getElementsByTagName("head")[0].appendChild(c)}var g,h,i,j,k=b.createElement("canvas"),l=k.getContext&&k.getContext("2d");for(j=Array("flag","emoji"),c.supports={everything:!0,everythingExceptFlag:!0},i=0;i<j.length;i++)c.supports[j[i]]=e(j[i]),c.supports.everything=c.supports.everything&&c.supports[j[i]],"flag"!==j[i]&&(c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&c.supports[j[i]]);c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&!c.supports.flag,c.DOMReady=!1,c.readyCallback=function(){c.DOMReady=!0},c.supports.everything||(h=function(){c.readyCallback()},b.addEventListener?(b.addEventListener("DOMContentLoaded",h,!1),a.addEventListener("load",h,!1)):(a.attachEvent("onload",h),b.attachEvent("onreadystatechange",function(){"complete"===b.readyState&&c.readyCallback()})),g=c.source||{},g.concatemoji?f(g.concatemoji):g.wpemoji&&g.twemoji&&(f(g.twemoji),f(g.wpemoji)))}(window,document,window._wpemojiSettings);
		</script>
		<style type="text/css">
img.wp-smiley,
img.emoji {
	display: inline !important;
	border: none !important;
	box-shadow: none !important;
	height: 1em !important;
	width: 1em !important;
	margin: 0 .07em !important;
	vertical-align: -0.1em !important;
	background: none !important;
	padding: 0 !important;
}
</style>

Visto lo visto, para desactivarlo solo tenemos que añadir una función en tu tema que evite la carga de los Emojis, y se así evitaremos cargar código innecesario para nuestro blog o web en la que trabajamos.

Para ello abrir vuestro archivo functions.php y añadir estas líneas

/**
 * Disable the emoji's
 */
function disable_emojis() {
	remove_action( 'wp_head', 'print_emoji_detection_script', 7 );
	remove_action( 'admin_print_scripts', 'print_emoji_detection_script' );
	remove_action( 'wp_print_styles', 'print_emoji_styles' );
	remove_action( 'admin_print_styles', 'print_emoji_styles' );	
	remove_filter( 'the_content_feed', 'wp_staticize_emoji' );
	remove_filter( 'comment_text_rss', 'wp_staticize_emoji' );	
	remove_filter( 'wp_mail', 'wp_staticize_emoji_for_email' );
	add_filter( 'tiny_mce_plugins', 'disable_emojis_tinymce' );
}
add_action( 'init', 'disable_emojis' );

/**
 * Filter function used to remove the tinymce emoji plugin.
 * 
 * @param    array  $plugins  
 * @return   array             Difference betwen the two arrays
 */
function disable_emojis_tinymce( $plugins ) {
	if ( is_array( $plugins ) ) {
		return array_diff( $plugins, array( 'wpemoji' ) );
	} else {
		return array();
	}
}

Con esto hemos conseguido hacer desaparecer los Emojis y con ello hemos restado tiempo de carga de nuestra web.

Además de hacerlo de forma manual, tenéis varias opciones para no tocar vosotros ningún archivo. Os dejo 2 plugins que os harán la misma función que os he comentado anteriormente.

Cualquiera de los dos, os hará el mismo servicio.

Un saludo a todos.

Velocidad de carga vs Emojis Modificado: mayo 18th, 2018 por Carlos González Gurrea
1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (2 votos, promedio: 5,00 de 5)
Cargando...