A la hora de mejorar mejorar el rendimiento de nuestras páginas web podemos hacer cuatro cosas:
Realizar menos peticiones HTTP
Añadir una cabecera para que expire en el futuro
Comprimir mediante Gzip componentes de la página
Reducir el tamaño de los archivos Javascript, CSS y HTML
Todo esto se puede hacer con la librería que mostramos a continuación: reduce las peticiones porque junta los archivos CSS y Javascript, y reduce los CSS, HTML y Javascript eliminando espacios y cosas parecidas y luego cacheando.
Para ello solo habrá que añadir como mínimo 3 líneas:
require_once('class.compressor.php');
$compressor = new compressor('css,javascript,page');
// Y al final del script
$compressor->finish();
phc es un compilador de PHP (un poco verde aún) que nos permite crear ejecutables con el código de un script PHP.
Para los desarrolladores de PHP nos ofrece las siguientes posibilidades:
Compilar código PHP en ejecutables optimizados
Compliar aplicaciones web en extensiones optimizadas
Formatear el código PHP de forma “bonita”
Ofuscar el código PHP
Combinar varios scripts PHP en uno solo
Optimizar el código PHP usando optimizaciones de complicación (experimental)
Ahora tengo dos dudas, si todo fuera optimizado y no se tratara de una versión inicial (por ahora no admite programación orientada a objetos):
¿En Apache se pueden ejecutar los compilados en el cgi-bin?, juraría que sí pero no lo tengo muy claro.
¿Qué es más eficiente: Apache preparado para interpretar PHP o ejecutar un compilado? siempre es más eficiente ejecutar que interpretar, pero no estoy tan puesto en Apache para saber qué puede ser más rápido.
WordPress 3.4 ha añadido la opción de theme customizer, la cual permite modificar las opciones del theme y darle el aspecto que deseas de forma muy visual y sencilla. En estos momentos, por lo que he podido ver, solo permite modificar el background y poco más. Pero viendo y pegándome con el código he podido ver cómo añadir mis propias opciones.
El ejemplo que voy a poner permite elegir entre tres tipos de fuente de Google Webfonts y modificar las css para usar ese tipo de letra.
Aviso que el código quizás no sea el mejor, pero realizar ingeniería inversa no siempre es fácil y tampoco he visto otro sitio donde lo hagan.
Lo primero que se tiene que hacer es crear las opciones en el panel de customizer. Para ello hay que crear una sección (section “Fuente”) y asignarle unas opciones (settings) y añadirle unos controles (control) a las opciones. Existen controles por defecto, el de elegir el color está muy bien, pero en mi caso me he creado uno personalizado que muestra un control radio modificado para que el label del radio muestre la tipo de letra en cuestión.
add_action('customize_register', 'mi_theme_customizer', 1);
function mi_theme_customizer() {
global $customize;
if($customize) {
// La seccion
$customize->add_section('mi_font', array(
'title'=>'Fuente'
) );
// La opcion
$customize->add_setting( 'mi_font_family', array(
'control' => 'color', // esto ni idea de para que sirve, realmente no es un control tipo color y funciona
'type' => 'option'
) );
$customize->add_control( 'mi_font_family', array(
'settings' => 'mi_font_family',
'section' => 'mi_font',
'type' => 'font_radio',
'choices' => array('Trocchi', 'Great Vibes', 'Bad Script') // las fuentes de google
) );
}
}
Una vez creado los controles, añado el código que dibuja (render) mi control personalizado, primero añado los css para que dibuje las fuentes de Google y luego dibujo el control en sí. He usado Javascript en vez de PHP porque parece ser que el código no está del todo completo, y no hay un filtro para crear tu propio control, por lo que tengo que añadirlo mediante jQuery a un elemento para que el Javascript del customizer tenga en cuenta cuando selecciono una opción y refresque el preview del theme.
// Añado los css de google webfonts mediante javascript para tener luego el nombre de las fuentes y usarlo para crear los radio buttons
add_action('customize_controls_print_scripts', 'mi_customize_scripts');
function mi_customize_scripts() {
$fonts = array('Trocchi', 'Great Vibes', 'Bad Script');
?>
type == 'font_radio') {
if ( empty( $control->choices ) )
return;
$name = '_customize-font-radio-' . $control->id;
?>
label ); ?>
Y ya por último solo falta usar la opción guardada para mostrarla en el theme
add_action('wp_head', 'mi_custom_styles');
function mi_custom_styles() {
$option = get_option('mi_font_family');
// El customizer modifica este filtro para refrescar el preview
$option = apply_filters('option_mi_font_family', $option);
if ($option) {
echo "";
echo '';
}
}
Y esto es todo, no sé si hay una forma mejor de hacerlo, estoy abierto a sugerencias.
La jerarquía de las plantillas de wordpress permite definir diferentes plantillas para mostrar según el tipo de contenido. Por ejemplo, la template para mostrar el contenido de un post es single.php, pero si es un custom post type podemos crearnos la template single-miposttype.php y que use esa plantilla específica para mostrar los contenidos del custom post type. Si se trata de una página mostrará page.php, y así con todos los tipos de contenido.
Lo que nos encontramos en ocasiones es que queremos ejecutar un javascript específico asociado a esa plantilla, lo cual podemos hacerlo a la hora de añadir los scripts preguntando por el tipo de contenido. Pero si lo queremos hacer de una forma más automática, podemos añadir en el filtro template_include la acción de añadir el script.
add_filter('template_include', 'js_load_script_template');
function js_load_script_template($template) {
// Obtenemos el fichero de la template que se usa
$js = pathinfo($template);
$js = $js['filename'];
// Me gusta obtener la versión del theme para evitar caches
$my_theme = wp_get_theme();
$version = $my_theme->get( 'Version' );
// Si el fichero js existe, p.e. single-miposttype.js lo añadimos
if (file_exists(get_template_directory().'/js/'.$js.'.js')) {
wp_enqueue_script( $js, get_bloginfo('template_directory').'/js/'.$js.'.js', array(), $version );
}
// Tambien ejecuto el script relacionado con la plantilla generica, p.e. single.js
$js_part = preg_replace('#^([^\-]+)\-.*$#', '$1', $js);
if ($js != $js_part && file_exists(get_template_directory().'/js/'.$js_part.'.js')) {
wp_enqueue_script( $js_part, get_bloginfo('template_directory').'/js/'.$js_part.'.js', array(), $version );
}
return $template;
}
Aunque las nubes de etiquetas ya no están tan de moda como hace un tiempo, el tutorial donde explican cómo hacer un tagscloud mediante jQuery merece la pena, ya que se trata de una explicación detallada.
No solo se centra en jQuery, sino en la parte PHP que devuelve los datos en JSON y en los estilos CSS para mostrar las etiquetas según su relevancia.
Realmente la parte jQuery solo cambia el tamaño de la letra según la frecuencia de la etiqueta. Building a jQuery-Powered Tag-Cloud
Cuando queremos que nuestro servidor web muestre los ficheros y directorios que hay en un directorio dado (algo que se debería evitar por defecto), nos encontramos con que el diseño o la estructura no es la que deseamos.
Si queremos personalizar esta página mediante PHP podemos usar una librería que nos permite recrear la página por defecto, añadiendo otras características como lectura de zips, posiblidad de borrar ficheros y previews de imágenes y vídeos. PHP Directory Listing Script
Vía / With Tech Eyes
El UTF-8 es un tipo de codificación de caracteres para Unicode que nos permite escribir nuestras páginas web y no preocuparnos por si se va a ver correctamente o van a aparecer caracteres extraños.
Las veces que he trabajado en proyectos multilenguaje es lo que hemos usado, salvo en el caso de japonés y coreano que es preferible usar el UTF-16 porque ocupa menos espacio. Eso ha hecho que me haya acostumbrado a realizar siempre los proyectos en UTF-8 y así evitar luego los problemas que puedan surgir en futuras actualizaciones o en testeos y tener luego que cambiar todo el proyecto a UTF-8.