El (próximo) renacimiento de WordPress

Han pasado 8 meses desde que se lanzó Gutenberg como editor de contenido predeterminado en WordPress. Dependiendo de a quién le preguntes, es posible que escuches que Gutenberg es lo peor o lo mejor que le ha pasado a WordPress (o cualquier cosa intermedia). Pero algo con lo que la mayoría de la gente parece estar de acuerdo es que Gutenberg ha ido mejorando constantemente. Al ritmo de desarrollo actual, es solo cuestión de tiempo que se resuelvan sus problemas más destacados y la experiencia de usuario sea realmente agradable.

Gutenberg es un trabajo continuo en progreso. Mientras lo uso, experimento molestias enloquecedoras, como opciones flotantes en las que no puedo hacer clic porque el bloque colocado debajo se selecciona en su lugar, agrupación poco intuitiva de bloques, columnas con tanto espacio que las hace inútiles y el elemento "+". llamando mi atención por toda la página. Sin embargo, los problemas que encuentro todavía son relativamente manejables (lo cual es una mejora con respecto a las versiones anteriores) y, además, Gutenberg ha comenzado a hacer realidad sus beneficios potenciales: muchos de sus errores más urgentes se han solucionado, sus problemas de accesibilidad son se están resolviendo, y continuamente se ponen a disposición nuevas y emocionantes características. Lo que tenemos hasta ahora es bastante decente, y solo mejorará cada vez más.

Repasemos los nuevos desarrollos que han tenido lugar desde el lanzamiento de Gutenberg y hacia dónde se dirige.

Nota: Para obtener más información sobre este tema, recomiendo ver la charla del fundador de WordPress, Matt Mullenweg, durante la reciente WordCamp Europe 2019.

Por qué se necesitaba a Gutenberg

Gutenberg llegó justo a tiempo para impulsar el rejuvenecimiento de WordPress, para intentar hacer que WordPress fuera atractivo para los desarrolladores una vez más (y revertir su estado actual de ser la plataforma más temida). WordPress había dejado de verse atractivo debido a su enfoque en no romper la compatibilidad con versiones anteriores, lo que impedía que WordPress incorporara código moderno, lo que lo hacía parecer pálido en comparación con los marcos más nuevos y brillantes.

Mucha gente argumenta que WordPress no estaba en peligro de morir (después de todo, alimenta más de 1/3 de la web), por lo que Gutenberg no era realmente necesario, y puede que tengan razón. Sin embargo, incluso si WordPress no estaba en peligro inmediato, al estar desconectado de las tendencias modernas de desarrollo, se dirigía hacia la obsolescencia, posiblemente no a corto plazo, pero ciertamente a mediano y largo plazo. Revisemos cómo Gutenberg mejora la experiencia para diferentes partes interesadas de WordPress: desarrolladores, administradores de sitios web y usuarios de sitios web.

Los desarrolladores han adoptado recientemente la creación de sitios web a través de las bibliotecas de JavaScript Vue y React debido (entre otras razones) a la potencia y la comodidad de los componentes, lo que se traduce en una experiencia de desarrollador satisfactoria. Al subirse al carro y adoptar esta técnica, Gutenberg permite que WordPress atraiga a los desarrolladores una vez más, permitiéndoles codificar de una manera que les resulte gratificante.

Los administradores de sitios web pueden administrar su contenido más fácilmente, mejorar su productividad y lograr cosas que antes no se podían hacer. Por ejemplo, colocar un video de Youtube a través de un bloque es más fácil que a través de TinyMCE Textarea, los bloques pueden servir imágenes óptimas (comprimidas, redimensionadas según el dispositivo, convertidas a un formato diferente, etc.) eliminando la necesidad de hacerlo manualmente. y las capacidades WYSIWYG ( lo que ves es lo que obtienes ) son lo suficientemente decentes como para proporcionar una vista previa en tiempo real de cómo se verá el contenido en el sitio web.

Al darles acceso a una potente funcionalidad, los usuarios del sitio web tendrán una mayor satisfacción al navegar por nuestros sitios, como la experimentan al usar aplicaciones web altamente dinámicas y fáciles de usar, como Facebook o Twitter.

Además, Gutenberg está modernizando de forma lenta pero segura todo el proceso de creación del sitio web. Si bien actualmente solo se puede usar como editor de contenido, en el futuro se convertirá en un creador de sitios completo, lo que permitirá colocar componentes (llamados bloques) en cualquier lugar de una página, incluidos el encabezado, el pie de página, la barra lateral, etc. (Automattic, la compañía detrás de WordPress.com, ya comenzó a trabajar en un complemento que agrega capacidades completas de edición de sitios para su sitio comercial, desde el cual podría adaptarse para el software de código abierto de WordPress). A través de la función de creación de sitios, no -Los usuarios expertos en tecnología podrán agregar funciones muy poderosas a sus sitios muy fácilmente, por lo que WordPress seguirá dando la bienvenida a la gran comunidad de personas que trabajan en la web (y no solo a los desarrolladores).

Rápido ritmo de desarrollo

Una de las razones por las que Gutenberg ha experimentado un ritmo de desarrollo tan rápido es porque está alojado en GitHub, lo que simplifica la gestión del código, los problemas y la comunicación en comparación con Trac (que maneja el núcleo de WordPress) y facilita la primera -contribuyentes de tiempo para involucrarse, ya que es posible que ya tengan experiencia trabajando con Git.

Al estar desvinculado del núcleo de WordPress, Gutenberg puede beneficiarse de una iteración rápida. Aunque se lanza una nueva versión de WordPress cada 3 meses más o menos, Gutenberg también está disponible como un complemento independiente, que ve una nueva versión cada dos semanas (mientras que la última versión de WordPress contiene Gutenberg versión 5.5, la última versión del complemento es 6.2 ). Tener acceso a nuevas y poderosas funciones para nuestros sitios cada dos semanas es realmente impresionante y permite desbloquear más funciones del ecosistema más amplio (por ejemplo, el complemento AMP requiere Gutenberg 5.8+ para varias funciones).

WordPress sin cabeza para potenciar múltiples pilas

Uno de los efectos secundarios de Gutenberg es que WordPress se ha vuelto cada vez más "sin cabeza", desvinculando aún más la representación de la aplicación de la gestión del contenido. Esto se debe a que Gutenberg es un cliente front-end que interactúa con el back-end de WordPress a través de las API (la API REST de WP), y el desarrollo de Gutenberg ha exigido una expansión constante de las API disponibles. Estas API no están restringidas a Gutenberg; se pueden usar junto con cualquier marco del lado del cliente para representar el sitio usando cualquier pila.

Un ejemplo de una pila que podemos aprovechar para nuestra aplicación de WordPress es JAMstack, que defiende una arquitectura basada en sitios estáticos aumentados a través de servicios de terceros (API) para volverse dinámicos (¡de hecho, Smashing Magazine es un sitio JAMstack!). De esta manera, podemos alojar nuestro contenido en WordPress (aprovechándolo como un sistema de gestión de contenido, que es en lo que realmente es bueno), construir una aplicación que acceda al contenido a través de API, generar un sitio estático y desplegarlo en un Contenido Delivery Network, proporcionando menores costos y mayor velocidad de acceso.

Nueva Funcionalidad

Juguemos con Gutenberg (el complemento, no el incluido en el núcleo de WordPress, que está disponible aquí) y veamos qué funcionalidad se ha agregado en los últimos meses.

Administrador de bloques

A través del administrador de bloques, podemos decidir qué bloques estarán disponibles en el editor de contenido; todos los demás estarán deshabilitados. Eliminar el acceso a bloques no deseados puede ser útil en varias situaciones, como por ejemplo:

• Muchos complementos son paquetes de bloques; al instalar dicho complemento, todos sus bloques se agregarán al editor de contenido, incluso si solo necesitamos uno
• Se implementan hasta 40 proveedores de inserción en el núcleo de WordPress, pero es posible que necesitemos solo algunos de ellos para la aplicación, como Vimeo y Youtube.
• Tener una gran cantidad de bloques disponibles puede abrumarnos, perjudicando nuestro flujo de trabajo al agregar capas adicionales que el usuario necesita para navegar, lo que lleva a un uso subóptimo del tiempo; por lo tanto, deshabilitar temporalmente los bloques innecesarios puede ayudarnos a ser más efectivos
• Del mismo modo, tener solo los bloques que necesitamos evita posibles errores causados ​​por el uso de bloques incorrectos; en particular, establecer qué bloques se necesitan se puede hacer de manera descendente, con el administrador del sitio web analizando todos los bloques disponibles y decidiendo cuáles usar, e imponiendo la decisión a los administradores de contenido, quienes luego quedan relevados de esta tarea y pueden concentrarse en sus propias funciones.

Bloque de cubierta con elementos de anidamiento

El bloque de portada (que nos permite agregar un título sobre una imagen de fondo, generalmente útil para crear encabezados de héroe) ahora define sus elementos internos (es decir, el encabezado y los botones, que se pueden agregar para crear un llamado a la acción) como elementos anidados, permitiéndonos modificar sus propiedades de manera uniforme en todos los bloques (por ejemplo, podemos poner el encabezado en negrita y agregarle un enlace, colocar uno o más botones y cambiar su color de fondo, entre otros).

Agrupación y anidamiento de bloques

Tenga cuidado: ¡Estas características todavía tienen errores! Sin embargo, se les está dedicando mucho tiempo y energía, por lo que podemos esperar que funcionen sin problemas pronto.

La agrupación de bloques permite agrupar varios bloques, de modo que al moverlos hacia arriba o hacia abajo en la página, todos se muevan juntos. Anidar bloques significa colocar un bloque dentro de un bloque, y no hay límite para la profundidad de anidamiento, por lo que podemos tener bloques dentro de bloques dentro de bloques dentro de... (ya me entendiste). El anidamiento de bloques es especialmente útil para agregar columnas en el diseño, a través de un bloque de columnas, y luego cada columna puede contener dentro cualquier tipo de bloque, como imágenes, texto, videos, etc.

Migración de widgets preexistentes

Mientras que en el pasado había varios métodos para agregar contenido en la página (contenido TinyMCE, códigos abreviados, widgets, menús, etc.), los bloques intentan unificarlos todos en un solo método. Actualmente, el código heredado recién considerado, como los widgets, se está migrando al formato de bloque.

Recientemente, el widget "Últimas publicaciones" se ha vuelto a implementar como un bloque, lo que admite una vista previa en tiempo real de cómo se ve el diseño al configurarlo (cambiar la cantidad de palabras para mostrar, mostrar un extracto o la publicación completa, mostrar la fecha o no, etc.).

Animación de movimiento

Mover bloques hacia arriba o hacia abajo en la página solía implicar una transición abrupta, lo que a veces dificultaba entender cómo se reordenaban los bloques. Desde Gutenberg 6.1, una nueva función de animación en movimiento resuelve este problema al agregar un movimiento realista a los cambios de bloque, como cuando se crea, elimina o reordena un bloque, brindando una indicación visual muy mejorada de las acciones realizadas para reordenar bloques. Además, el concepto general de animación en movimiento se puede aplicar en todo Gutenberg para expresar cambios y, por lo tanto, mejorar la experiencia del usuario y brindar un mejor soporte de accesibilidad.

Funcionalidad (con suerte) próximamente

Según el fundador de WordPress, Matt Mullenweg, hasta ahora solo se ha implementado el 10 % de la hoja de ruta completa de Gutenberg, por lo que nos esperan muchas cosas nuevas y emocionantes. El trabajo en las nuevas funciones que se enumeran a continuación ya comenzó o el equipo está experimentando con ellas actualmente.

• Directorio de bloques
  Un nuevo elemento de nivel superior en wp-admin que proporcionará descubrimiento de bloques. De esta forma, los bloques se pueden instalar de forma independiente, sin tener que enviarlos a través de un complemento.
• Bloques de navegación
  Actualmente, los menús de navegación deben crearse a través de su propia interfaz. Sin embargo, pronto podremos crearlos a través de bloques y colocarlos en cualquier parte de la página.
• Instalación en línea de bloques
  Al poder descubrir bloques, el siguiente paso lógico es poder instalar un nuevo bloque sobre la marcha, donde más se necesita: en el editor de publicaciones. Podremos instalar un bloque mientras escribimos una publicación, usar el nuevo bloque para generar su HTML, guardar su salida en la publicación y eliminar el bloque, todo sin tener que navegar a una página de administración diferente.
• Ajustar a la cuadrícula al cambiar el tamaño de las imágenes
  Cuando colocamos varias imágenes en nuestra publicación, cambiar su tamaño al mismo ancho o alto puede resultar un proceso doloroso de intentar y fallar repetidamente hasta hacerlo bien, lo cual está lejos de ser ideal. Pronto, será posible ajustar la imagen a una capa de cuadrícula virtual que aparece en el fondo a medida que se cambia el tamaño de la imagen.

WordPress se está volviendo atractivo (una vez más)

Varias razones respaldan la idea de que WordPress pronto se convertirá en una plataforma atractiva para codificar, como solía ser una vez. Veamos un par de ellos.

Modernización PHP

La búsqueda de WordPress para modernizarse no termina con la incorporación de modernas bibliotecas y herramientas de JavaScript (React, webpack, Babel): también se extiende al lenguaje del lado del servidor: PHP. La versión mínima de PHP de WordPress se aumentó recientemente a 5.6, y debería actualizarse a la versión 7.0 a partir de diciembre de 2019. PHP 7 ofrece ventajas notables sobre PHP 5, en particular, duplica con creces su velocidad, y las versiones posteriores de PHP (7.1 , 7.2 y 7.3) se han vuelto aún más rápidos.

Aunque parece que no hay planes oficiales para continuar con la actualización de PHP 7.0 a sus versiones posteriores, una vez que el impulso está ahí, es más fácil mantenerlo. Y PHP también se está mejorando sin descanso. El próximo PHP 7.4, que se lanzará en noviembre de 2019, incluirá muchas mejoras nuevas, incluidas funciones de flecha y el operador de propagación dentro de las matrices (como se usa para JavaScript moderno), y un mecanismo para precargar bibliotecas y marcos en OPCache para mejorar aumentar el rendimiento, entre varias otras características interesantes.

Reutilización de código a través de plataformas

Un gran efecto secundario de la desvinculación de Gutenberg de WordPress es que también se puede integrar con otros marcos. ¡Y eso es exactamente lo que ha pasado! Gutenberg ahora está disponible para Drupal, y Laraberg (para Laravel) pronto se lanzará oficialmente (actualmente probando la versión candidata). ¡La belleza de este fenómeno es que, a través de Gutenberg, todos estos marcos diferentes ahora pueden compartir/reutilizar código!

Conclusión

Nunca ha habido un mejor momento para ser desarrollador web. El ritmo de desarrollo de todos los lenguajes y tecnologías involucrados (JavaScript, CSS, optimización de imágenes, fuentes variables, servicios en la nube, etc.) es asombroso. Hasta hace poco, WordPress observaba esta tendencia de desarrollo desde el exterior y es posible que los desarrolladores sintieran que estaban perdiendo el tren de la modernización. Pero ahora, a través de Gutenberg, WordPress también se está subiendo al tren y se mantiene al día con su historia de dirigir la web en una dirección positiva.

Es posible que Gutenberg aún no sea completamente funcional, ya que tiene muchos problemas que resolver, y aún puede pasar algún tiempo hasta que realmente cumpla sus promesas. Sin embargo, hasta ahora se ve bien, y se ve cada vez mejor con cada nuevo lanzamiento: Gutenberg está brindando constantemente nuevas posibilidades a WordPress. Como tal, este es un buen momento para reconsiderar darle una oportunidad a Gutenberg (es decir, si aún no lo ha hecho). Cualquiera que de alguna manera trate con WordPress (administradores de sitios web, desarrolladores, administradores de contenido, usuarios de sitios web) puede beneficiarse de esta nueva normalidad. Yo diría que esto es algo por lo que estar emocionado, ¿no?