Aviso con tiempo que tarda el blog o la página en cargarse

Se puede poner el tiempo que tarda en cargar nuestro blog o página de una forma muy sencilla.

Esto puede ser bueno para determinar si es un tiempo adecuado o tarda demasiado, y así evaluar si hay que hacerle algún tipo de reforma a nuestro blog o página.

Hay varias páginas que podemos ver el tiempo de carga como pueden ser Pingdom o Webwait.

Esta ves con un sencillo código JavaScript, lo podemos mostrar en el blog o página.

Primero pondremos el código JavaScript.

Ir a Diseño, Edición de HTML y justo arriba de </head>

Poner el siguiente código:

<script type='text/javascript'>
//<![CDATA[
var iniciotp=new Date();
iniciotp=iniciotp.getTime();
function initp() {
fintp=new Date();
fintp=fintp.getTime();
tiempo=(fintp-iniciotp)/1000;
document.getElementById('tmpini').innerHTML=tiempo;
}
window.onload=initp
//]]>
</script>

Si queremos que en determinado tiempo deje de mostrar el aviso, hay que agregar otra función con setTimeout

El código a poner en lugar del anterior, sera el siguiente:

<script type='text/javascript'>
//<![CDATA[
var iniciotp=new Date();
iniciotp=iniciotp.getTime();
function initp() {
fintp=new Date();
fintp=fintp.getTime();
tiempo=(fintp-iniciotp)/1000;
document.getElementById('tmpini').innerHTML=tiempo;
}
window.onload=initp

function cerrartiempo(){
div = document.getElementById('tiemposeg');
div.style.display='none';
}
setTimeout(cerrartiempo, 25000);
//]]>
</script>

Modificamos los milisegundos. (En el ejemplo se cierra a los 25 segundos.)

Ahora pondremos donde queramos mostrar el aviso, que puede ser en un gadget HTML/Javascript,
o directamente abajo de <body>.

Poner lo siguiente:

<div id='tiemposeg' style='text-align: center;color:#369'>Tiempo que ha tardado la página en cargarse: <span id='tmpini' style='color:red'>Calculando...</span> segundos.</div>

Se puede personalizar, cambiando el texto, color etc...

Si solo quieren verlo ustedes sin mostrarlo a los visitantes le agregaremos las clases item-control blog-admin

De la siguiente forma:

<div class='item-control blog-admin' id='tiemposeg' style='text-align: center;color:#369'>Tiempo que ha tardado la página en cargarse: <span id='tmpini' style='color:red'>Calculando...</span> segundos.</div>

Si tienes alguna opinión respecto a la entrada, tienes un punto de vista distinto, o simplemente quieres saludar, te invito a que dejes un comentario. NO SE ACEPTAN LINKS DE REFERIDOS para que los comentarios no se conviertan simplemente en una forma de publicitarse.