Comprar velocidad en eBay.com

Optimización del rendimiento de los sitios y aplicaciones de eBayConcepto de Ebay¿Qué es Ebay?Ebay es una página web considerada como uno de los mayores puntos de compra y venta de todo el panorama digital. Es un punto de encuentro entre compradores y vendedores, que pueden ser tanto profesionales como particulares, que permite la realización de ventas mediante de Internet, sin necesidad de contar con un establecimiento físico en el que llevar a término los trámites.Una plataforma que, en cierto más para una experiencia de usuarioEl término experiencia de usuario (UX) se refiere a la experiencia que un usuario tiene con un producto o servicio. En cuanto a Internet, el término se usa frecuentemente al examinar la experiencia que los usuarios disponen con una web. Esto además puede ser en referencia al uso de un dispositivo smartphone (UX smartphone). Items de la experiencia del usuario La experiencia del usuario y la usabilidad se usan frecuentemente más más rápida.

22 de enero de 2020

La velocidad fue un iniciativa de toda la empresa para eBay en 2019, con muchos equipos decididos a hacer que el sitio y las aplicaciones sean lo más rápido posible para los usuarios. De hecho, por cada 100 milisegundos de mejora en el tiempo de carga de la página de búsqueda, eBay registró un aumento del 0,5% en el recuento de «Agregar al carrito».

Mediante la adopción de Presupuestos de Desempeño (derivados después de realizar un estudio competitivo con el Informe de experiencia del usuario de Chrome) y un enfoque en métricas clave de rendimiento centradas en el usuario, eBay pudo realizar mejoras significativas en la velocidad del sitio.

… Y sus datos del Informe de experiencia del usuario de Chrome también destacan estas mejoras.

Todavía hay más trabajo por delante, pero aquí están los aprendizajes de eBay hasta ahora.

«Cortes» de rendimiento web

Las mejoras que hizo eBay fueron posibles gracias a la reducción o «recortes» (en tamaño y tiempo) de varias entidades que participan en el viaje de un usuario. Esta publicación cubre temas que son relevantes para la comunidad de desarrolladores web en general, en lugar de temas específicos de eBay.

Reducir la carga útil en todos los recursos de texto

Una forma de hacer que los sitios sean rápidos es simplemente cargar menos código. eBay redujo la carga útil de texto recortando todos los bytes innecesarios y no utilizados de las respuestas de JavaScriptJavaScript es un lenguaje de programación que funciona en el lado del cliente y con el que las webs pueden ser más funcionales. Incorporación en código HTML El código JavaScript puede ser incrustado en las páginas HTML, para que adquieran funcionalidad. Existen varias opciones. Puede estar entre las etiquetas <SCRIPT> y </SCRIPT>, puede estar contenido en un archivo externo, puede ser un parámetro de las etiquetas HTML, y puede estar más, CSSConcepto de CSS¿Qué es el CSS?CSS es un lenguaje de programación que se usa para definir el estilo y el aspecto de un documento que se ha escrito mediante de un lenguaje de etiquetas, como HTML. Conocido además como hojas de estilo en cascada, es el que se emplea para dar colores, indicar tipos de letra o inclusive resaltar aspectos como el espacio entre items para dotar de estilo a más, HTMLHTML (Hypertext Markup Language) se usa para estructurar el contenido de texto de un documento web. No sólo se marca el contenido, sino además la meta-información que describe este contenido. Las páginas HTML se almacenan normalmente en el directorio raíz del servidor. Cómo se creó En la era digital, a los usuarios les resulta difícil hallar su camino en las webs y hacer un seguimiento de las estructuras de las más y JSON que se ofrecen a los usuarios. Anteriormente, con cada nueva función, eBay seguía aumentando la carga útil de sus respuestas, sin limpiar lo que no se usaba. Esto se acumuló con el tiempo y se convirtió en un cuello de botella de rendimiento. Los equipos generalmente postergaban esta actividad de limpieza, pero te sorprendería cuánto ahorró eBay.

El «corte» aquí son los bytes desperdiciados en la carga útil de respuesta.

Optimización de la ruta crítica para el contenidoEl contenido puede ser muy difícil de definir con precisión. Es una definición que se refiere a las declaraciones contenidas en un documento o publicación de cualquier tipo y puede incluir las tecnologías de la información y la comunicación. Esto cubre todos los tipos de medios como imágenes y texto. A parte de esto, en el campo de la optimización de motores de búsqueda, los términos duplicar contenido, contenido único, más de la mitad superior de la página

No todos los píxeles de la pantalla son igualmente importantes. El contenido encima de la tapa es más crítico que algo por debajo del pliegue. Las aplicaciones nativas y web son conscientes de esto, pero ¿qué pasa con los servicios? La arquitectura de servicios de eBay tiene una capa llamada
Servicios de experiencia, con el que hablan los frontends (aplicaciones nativas y servidores web). Esta capa está diseñada específicamente para estar basada en vistas o dispositivos, en lugar de estar basada en entidades, como elementos, usuarios o pedidos. Luego, eBay introdujo el concepto de la ruta crítica para Experience Services. Cuando llega una solicitud a estos servicios, trabajan para obtener los datos del contenido de la mitad superior de la página inmediatamente, llamando a otros servicios ascendentes en paralelo. Una vez que los datos están listos, se eliminan instantáneamente. Los datos de la parte inferior de la página se envían en un fragmento posterior o con carga diferida. El resultado: los usuarios pueden ver el contenido de la mitad superior de la página más rápido.

El «corte» aquí es el tiempo que dedican los servicios a mostrar contenido relevante.

Optimizaciones de imagen

Las imágenes son uno de los mayores contribuyentes a la hinchazón de la página. Incluso las pequeñas optimizaciones son muy útiles. eBay hizo dos optimizaciones para las imágenes.

Primero, eBay estandarizó el formato de imagen WebP para los resultados de búsqueda en todas las plataformas, incluidas iOS, Android y navegadores compatibles. La página de resultados de búsqueda es la página con más imágenes en eBay, y ya estaban usando WebP, pero no en un patrón consistente.

En segundo lugar, aunque las imágenes de la lista de eBay están muy optimizadas (tanto en tamaño como en formato), no se aplicaba el mismo rigor a las imágenes seleccionadas (por ejemplo, el módulo superior en el
página principal). eBay tiene muchas imágenes seleccionadas a mano, que se cargan a través de varias herramientas. Anteriormente, las optimizaciones dependían del cargador, pero ahora eBay aplica las reglas dentro de las herramientas, por lo que todas las imágenes cargadas se optimizarán de manera adecuada.

El «corte» aquí son los bytes de imagen desperdiciados enviados a los usuarios.

Captación previa predictiva de activos estáticos

Una sesión de usuario en eBay no es solo una página. Es un fluir. Por ejemplo, el flujo puede ser una navegación desde la página de inicio a una página de búsqueda a la página de un elemento. Entonces, ¿por qué las páginas del flujo no se ayudan entre sí? Esa es la idea de la captación previa predictiva, en la que una página capta previamente los activos estáticos necesarios para la siguiente página probable.

Con la captación previa predictiva, cuando un usuario navega a la página prevista, los activos ya están en la cachéUn caché es un tipo de memoria auxiliar de la que se puede recuperar a alta velocidad con una capacidad de almacenamiento relativamente pequeña. Se encuentra entre la unidad central de procesamiento (CPU) y la memoria principal. Ayuda a evitar el acceso al disco duro o los recálculos complejos almacenando temporalmente ciertos datos y haciéndolos disponibles rápidamente cuando sea necesario. El caché almacena una copia de la petición actual y más del navegadorUn navegador (además: browser) es una herramienta informática que te permite ver documentos y datos y navegar por la red. Los navegadores pueden mostrar distintos tipos de recursos de información; principalmente documentos HTML, a pesar de todo, además son posibles otros tipos de archivos y contenido multimedia, como PDF, JPEG, MPEG, GIF o el lenguaje de meta marcado. A través el uso de complementos especiales y la configuración respectivo, los más. Esto se hace para los activos de CSS y JavaScript, donde las URLEl URL (Localizador Uniforme de Recursos), es una dirección definida que apunta a la posición de un archivo en un servidor y lo recupera. Las URL se introducen en un navegador web para ingresar a documentos en la web o se incrustan como hipervínculos dentro de un documento. Se puede usar un Permalink para que una URL esté disponible de forma permanente. Componentes de una URL • prefijo de protocolo más se pueden recuperar con anticipación. Una cosa a tener en cuenta aquí es que solo ayuda en la primera navegación. En navegaciones posteriores, los activos estáticos ya estarán en la caché.

El «corte» aquí es el tiempo de red para los activos estáticos de CSS y JavaScript en la primera navegación.

Obtención previa de los mejores resultados de búsqueda

Cuando un usuario busca en eBay, los datos analíticos de eBay sugieren que es muy probable que el usuario navegue hasta un artículo entre los 10 primeros resultados de búsqueda. Por lo tanto, eBay ahora obtiene los elementos de la búsqueda y los mantiene listos para cuando el usuario navegue. La captación previa ocurre en dos niveles.

El primer nivel ocurre en el lado del servidorLos servidores son ordenadores centrales y potentes dentro del campo de la tecnología de la información que procesan y proporcionan software y archivos en una red. Desde el punto de vista de un cliente, varios ordenadores en una red pueden ponerse en contacto con el servidor central para conseguir la información solicitada. En la arquitectura cliente-servidor, el servidor puede ser un software que proporciona un servicio y se ejecuta en más, donde el servicio de elementos almacena en caché los 10 elementos principales en los resultados de búsqueda. Cuando el usuario accede a uno de esos artículos, eBay ahora ahorra tiempo de procesamiento en el servidor. El almacenamiento en caché del lado del servidor es aprovechado por aplicaciones nativas y se implementa globalmente.

El otro nivel ocurre en la caché del navegador, que está disponible en Australia. La captación previa de elementos fue una optimización avanzada debido a la naturaleza dinámica de los elementos. También tiene muchos matices: impresionesConcepto de Impresiones¿Qué son las Impresiones?Las Impresiones son las visiones o las veces que una publicación, link, texto, imagen o vídeo aparece frente a los ojos de un usuario. Si nos refiriéramos a Google y sus resultados, una impresión sería cada vez que una persona ve una de las webs que aparecen al realizar una búsqueda, sin ingresar siquiera en ella, tan solo viendo cómo aparece mientras baja con el más de página, capacidad, artículos de subasta, etc. Puedes aprender más sobre esto en Presentación de la reunión de ingeniería de rendimiento de LinkedIn, o permanezca atento a una publicación de blogEl término blog se usa para describir un diario virtual en Internet. El autor de un blogger puede publicar posts sobre cualquier tema. Los posts suelen estar presente de forma cronológica. El estilo de redacción de un blog suele ser informal y se escribe en primera persona. No obstante, además son posibles otros estilos, por ejemplo en el caso de los periódicos online, en los que la atención se centra más detallada sobre el tema de los ingenieros de eBay.

El «corte» aquí puede ser el tiempo de procesamiento del servidor o el tiempo de la red, dependiendo de dónde se almacene el elemento.

Descarga ansiosa de imágenes de búsqueda

En la página de resultados de búsqueda, cuando se emite una consulta de alto nivel, suceden dos cosas. Uno es el paso de recuperación / clasificación, donde se devuelven los elementos más relevantes que coinciden con la consulta. El segundo paso es aumentar los artículos retirados con información adicional relacionada con el contexto del usuario, como los costos de envío. eBay ahora envía inmediatamente las primeras 10 imágenes de artículos al navegador en un fragmento junto con el encabezado, por lo que las descargas pueden comenzar antes de que llegue el resto del marcado. Como resultado, las imágenes ahora aparecerán más rápido. Este cambio se implementa a nivel mundial para la plataforma web.

El «corte» aquí es la hora de inicio de la descarga para las imágenes de resultados de búsqueda.

Almacenamiento en caché perimetral para datos de autosugestión

Cuando los usuarios escriben letras en el cuadro de búsqueda, aparecen sugerencias. Estas sugerencias no cambian para combinaciones de letras durante al menos un día. Son candidatos ideales para ser almacenados en caché y servidos desde un CDN (por un máximo de 24 horas), en lugar de que las solicitudes lleguen hasta un centro de datos. Los mercados internacionales se benefician especialmente del almacenamiento en caché de CDN.

Sin embargo, había una trampa. eBay tenía algunos elementos de personalización en la ventana emergente de sugerencias, que no se pueden almacenar en caché de manera eficiente. Afortunadamente, no fue un problema en las aplicaciones nativas, ya que la interfaz de usuario  Una interfaz de usuario es un medio por medio de del cual una persona puede controlar un software o hardware específico. Lo ideal es que las interfaces de usuario sean fáciles de utilizar para que la interacción sea lo más instintiva e intuitiva factible. En el caso de los programas informáticos, esto se denomina interfaz gráfica de usuario. Desarrollo y tipos de interfaces de usuario A diferencia de la más para la personalización y las sugerencias se podían separar. Para la web, en los mercados internacionales, la latencia era más importante que el pequeño beneficio de la personalización. Con eso fuera del camino, eBay ahora tiene autosugestiones servidas desde un caché de CDN a nivel mundial para aplicaciones nativas y mercados no estadounidenses para eBay.com.

El «corte» aquí es la latencia de la red y el tiempo de procesamiento del servidor para las sugerencias automáticas.

Almacenamiento en caché perimetral para usuarios de la página de inicio no reconocidos

Para la plataforma web, el contenido de la página de inicio para usuarios no reconocidos es el mismo para una región en particular. Se trata de usuarios que utilizan eBay por primera vez o inician una sesión nueva, por lo que no hay personalización. Aunque las creatividades de la página de inicio cambian con frecuencia, todavía hay espacio para el almacenamiento en caché.

eBay decidió almacenar en caché el contenido de usuario no reconocido (HTML) en su red perimetral (PoPs) durante un período breve. Los usuarios nuevos ahora pueden obtener el contenido de la página de inicio desde un servidor cercano, en lugar de un centro de datos lejano. eBay todavía está experimentando con esto en los mercados internacionales, donde tendrá un mayor impacto.

El «corte» aquí es nuevamente tanto la latencia de la red como el tiempo de procesamiento del servidor para los usuarios no reconocidos.

Optimizaciones para otras plataformas

Mejoras en el análisis de aplicaciones nativas

Las aplicaciones nativas (iOS y Android) se comunican con los servicios de backend cuyo formato de respuesta suele ser JSON. Estas cargas útiles JSON pueden ser grandes. En lugar de analizar todo el JSON para representar algo en la pantalla, eBay introdujo un algoritmoUn algoritmo es un procedimiento o conjunto de reglas a seguir en los cálculos u otras operaciones de resolución de problemas, fundamentalmente por un PC. Apps Un ejemplo de la vida cotidiana es una receta para hornear un pastel. Siguiendo los pasos de la receta se obtiene el pastel deseado al final. Otras apps conocidas son la búsqueda y clasificación. ¿Cómo se puede hallar un canal de televisión de la más de análisis eficiente que optimiza el contenido que debe mostrarse de inmediato.

Los usuarios ahora pueden ver el contenido más rápido. Además, para la aplicación de Android, eBay comienza a inicializar los controladores de vista de búsqueda tan pronto como el usuario comienza a escribir en el cuadro de búsqueda (iOS ya tenía esta optimización). Anteriormente, esto sucedía solo después de que los usuarios pulsaban el botón de búsqueda. Ahora los usuarios pueden acceder a sus resultados de búsqueda más rápido. El «corte» aquí es el tiempo que dedican los dispositivos a mostrar contenido relevante.

Mejoras en el tiempo de inicio de la aplicación nativa

Esto aplica a inicio fresco Optimizaciones de tiempo para aplicaciones nativas, en particular, Android. Cuando una aplicación se inicia en frío, se produce una gran cantidad de inicialización tanto a nivel de sistema operativo como de aplicación. Reducir el tiempo de inicialización en el nivel de la aplicación ayuda a los usuarios a ver la pantalla de inicio más rápido. eBay hizo algunos perfiles y notó que no todas las inicializaciones son necesarias para mostrar contenido y que algunas se pueden hacer con pereza.

Más importante aún, eBay observó que hubo una llamada de análisis de terceros bloqueando que retrasó la visualización en la pantalla. Eliminar la llamada de bloqueo y hacerla asincrónica ayudó aún más a los tiempos de inicio en frío. El «corte» aquí es el tiempo de inicio innecesario para las aplicaciones nativas.

Conclusiones

Todos los «recortes» de rendimiento que hizo eBay contribuyeron colectivamente a mover la aguja, y sucedieron durante un período de tiempo. Los lanzamientos se introdujeron gradualmente a lo largo del año, y cada lanzamiento redujo decenas de milisegundos, llegando finalmente al punto en el que eBay está ahora:

El rendimiento es una característica y una ventaja competitiva. Las experiencias optimizadas conducen a una mayor participación del usuario, conversiones y ROIConcepto de ROI¿Qué es el ROI?El ROI, siglas de Return On Investment (Retorno de la Inversión en castellano) es el valor económico que se ha obtenido como resultado de una campaña de marketing. Es un dato que se usa especialmente al momento de medir el rendimiento de todas las actividades relacionadas en el seno de dicha campaña, puesto que indica el dinero causado y puede usarse para realizar una comparación más. En el caso de eBay, estas optimizaciones variaron desde cosas que requirieron poco esfuerzo hasta algunas que fueron avanzadas.

Revisa Velocidad por mil cortes para obtener más información y estar atento a artículos más detallados de los ingenieros de eBay sobre su trabajo de rendimiento en un futuro próximo.