Achetez de la vitesse sur 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 Suite para una expérience utilisateurEl 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 Suite más rápida.

22 janvier 2020

La vitesse était un initiative à l'échelle de l'entreprise pour eBay en 2019, de nombreuses équipes étant déterminées à rendre le site et les applications aussi rapides que possible pour les utilisateurs. En fait, Pour chaque 100 millisecondes d'amélioration du temps de chargement de la page de recherche, eBay a constaté une augmentation de 0,51 TTP1T du nombre «Ajouter au panier».

En adoptant des budgets de performance (dérivés après avoir mené une étude concurrentielle avec le Rapport d'expérience utilisateur Chrome) et en se concentrant sur les indicateurs de performance clés centrés sur l'utilisateur, eBay a pu apporter des améliorations significatives à la vitesse du site.

… Et vos données du rapport sur l'expérience utilisateur de Chrome mettent également en évidence ces améliorations.

Il y a encore du travail à faire, mais voici les leçons d'eBay à ce jour.

«Pannes» des performances Web

Les améliorations apportées par eBay ont été rendues possibles par la réduction des effectifs ou des «coupes» (en taille et en temps) de diverses entités impliquées dans le parcours d'un utilisateur. Cet article couvre des sujets pertinents pour la communauté des développeurs Web en général, plutôt que des sujets spécifiques à eBay.

Réduisez la charge utile sur toutes les ressources texte

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 Suite, 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 Suite, 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 Suite 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.

La «coupure» ici correspond aux octets gaspillés dans la charge utile de réponse.

Optimización de la ruta crítica para el ContenuEl 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, Suite de la mitad superior de la página

Tous les pixels de l'écran ne sont pas aussi importants. Le contenu au-dessus du pli c'est plus critique que quelque chose en dessous du pli. Les applications natives et Web en sont conscientes, mais qu'en est-il des services? L'architecture de service d'EBay a une couche appelée
Expérience des services, avec lesquels les interfaces (applications natives et serveurs Web) parlent. Cette couche est spécifiquement conçue pour être basée sur la vue ou l'appareil, plutôt que sur l'entité, comme les articles, les utilisateurs ou les commandes. Ensuite, eBay a introduit le concept du chemin critique pour les services d'expérience. Lorsqu'une demande parvient à ces services, ils s'efforcent d'obtenir immédiatement les données de contenu de la moitié supérieure de la page, appelant d'autres services en amont en parallèle. Une fois que les données sont prêtes, elles sont instantanément supprimées. Les données au bas de la page sont envoyées dans un bloc ultérieur ou chargées paresseusement. Résultat: les utilisateurs peuvent voir plus rapidement le contenu de la moitié supérieure de la page.

Le «seuil» est ici le temps que les services passent à afficher un contenu pertinent.

Optimisations d'image

Les images sont l'un des plus gros contributeurs au gonflement des pages. Même de petites optimisations sont très utiles. eBay a effectué deux optimisations pour les images.

Premièrement, eBay a normalisé le format d'image WebP pour les résultats de recherche sur toutes les plates-formes, y compris iOS, Android et navigateurs pris en charge. La page de résultats de recherche est la page avec le plus d'images sur eBay, et ils utilisaient déjà WebP, mais pas de manière cohérente.

Deuxièmement, bien que les images des annonces eBay soient hautement optimisées (à la fois en taille et en format), la même rigueur n'a pas été appliquée aux images sélectionnées (par exemple, le module supérieur de la
page principal). eBay propose de nombreuses images triées sur le volet, qui sont téléchargées via divers outils. Auparavant, les optimisations dépendaient de l'uploader, mais maintenant eBay applique les règles dans les outils, de sorte que toutes les images téléchargées seront optimisées de manière appropriée.

La "coupe" ici est des octets d'image gaspillés envoyés aux utilisateurs.

Pré-acquisition prédictive des actifs statiques

Une session utilisateur sur eBay n'est pas qu'une page. C'est un flux. Par exemple, le flux peut être une navigation de la page d'accueil vers une page de recherche vers une page d'élément. Alors pourquoi les pages du flux ne s'aident-elles pas? C'est l'idée de la prélecture prédictive, dans laquelle une page pré-récupère les actifs statiques nécessaires pour la prochaine page probable.

Con la captación previa predictiva, cuando un usuario navega a la página prevista, los activos ya están en la cacheUn 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 Suite du le navigateurUn 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 Suite. 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 Suite 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é.

La «coupure» est ici l'heure du réseau pour les actifs CSS et JavaScript statiques lors de la première navigation.

Obtention antérieure des meilleurs résultats de recherche

Lorsqu'un utilisateur effectue une recherche sur eBay, les analyses d'eBay suggèrent que l'utilisateur est très susceptible de naviguer vers un article dans les 10 premiers résultats de recherche. Ainsi, eBay récupère désormais les éléments de la recherche et les garde prêts pour la navigation de l'utilisateur. La pré-absorption se produit à deux niveaux.

El primer nivel ocurre en el lado del serveurLos 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 Suite, 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: impressionsConcepto 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 Suite de página, capacidad, artículos de subasta, etc. Puedes aprender más sobre esto en Présentation de la réunion LinkedIn Performance Engineering, 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 Suite detallada sobre el tema de los ingenieros de eBay.

La "coupure" ici peut être le temps de traitement du serveur ou l'heure du réseau, selon l'endroit où l'élément est stocké.

Téléchargement impatient des images de recherche

Sur la page des résultats de recherche, lorsqu'une requête de haut niveau est émise, deux choses se produisent. L'une est l'étape de récupération / tri, où les éléments les plus pertinents correspondant à la requête sont renvoyés. La deuxième étape consiste à augmenter les articles rappelés avec des informations supplémentaires liées au contexte de l'utilisateur, telles que les frais d'expédition. eBay envoie désormais immédiatement les 10 premières images des éléments au navigateur dans un extrait de code avec l'en-tête, de sorte que les téléchargements peuvent commencer avant l'arrivée du reste du balisage. En conséquence, les images apparaîtront désormais plus rapidement. Ce changement est mis en œuvre globalement pour la plate-forme Web.

La «coupure» correspond à l'heure de début du téléchargement des images à partir des résultats de recherche.

Mise en cache Edge pour les données d'autosuggestion

Lorsque les utilisateurs saisissent des lettres dans la zone de recherche, des suggestions s'affichent. Ces suggestions ne changent pas pour les combinaisons de lettres pendant au moins un jour. Ce sont des candidats idéaux pour être mis en cache et servis à partir d'un CDN (pour un maximum de 24 heures), au lieu que les demandes parviennent à un centre de données. Les marchés internationaux bénéficient en particulier de la mise en cache 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 interface utilisateur  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 Suite 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.

La "coupure" ici est la latence du réseau et le temps de traitement du serveur pour les suggestions automatiques.

Mise en cache Edge pour les utilisateurs non reconnus de la page d'accueil

Pour la plate-forme Web, le contenu de la page d'accueil pour les utilisateurs non reconnus est le même pour une région particulière. Ce sont des utilisateurs qui utilisent eBay pour la première fois ou qui démarrent une nouvelle session, il n'y a donc pas de personnalisation. Bien que les créations de la page d'accueil changent fréquemment, il reste encore de la place pour la mise en cache.

eBay a décidé de mettre en cache le contenu utilisateur non reconnu (HTML) sur son réseau de périmètre (PoPs) pendant une courte période. Les nouveaux utilisateurs peuvent désormais obtenir le contenu de la page d'accueil à partir d'un serveur à proximité, plutôt que d'un centre de données distant. eBay est toujours en train d'expérimenter cela sur les marchés internationaux, où cela aura le plus grand impact.

La «coupure» ici est à nouveau à la fois la latence du réseau et le temps de débit du serveur pour les utilisateurs non reconnus.

Optimisations pour d'autres plates-formes

Améliorations de l'analyse des applications natives

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 Suite de análisis eficiente que optimiza el contenido que debe mostrarse de inmediato.

Les utilisateurs peuvent désormais afficher le contenu plus rapidement. De plus, pour l'application Android, eBay commence à initialiser les contrôleurs de vue de recherche dès que l'utilisateur commence à taper dans le champ de recherche (iOS avait déjà cette optimisation). Auparavant, cela ne se produisait qu'après que les utilisateurs aient cliqué sur le bouton de recherche. Les utilisateurs peuvent désormais accéder plus rapidement à leurs résultats de recherche. Le «seuil» est ici le temps que les appareils passent à afficher un contenu pertinent.

Améliorations du temps de démarrage de l'application native

Ceci s'applique à nouveau départ Optimisations de temps pour les applications natives, en particulier Android. Lorsqu'une application est démarrée à froid, une grande quantité d'initialisation se produit au niveau du système d'exploitation et de l'application. La réduction du temps d'initialisation au niveau de l'application permet aux utilisateurs de voir l'écran d'accueil plus rapidement. eBay a fait un profilage et a noté que toutes les initialisations ne sont pas nécessaires pour afficher le contenu et que certaines peuvent être effectuées paresseusement.

Plus important encore, eBay a noté qu'il y avait un blocage des appels d'analyse par un tiers qui retardait l'affichage à l'écran. La suppression de l'appel de blocage et le rendre asynchrone ont en outre contribué aux temps de démarrage à froid. La «coupure» ici est un temps de démarrage inutile pour les applications natives.

Conclusions

Toutes les «coupes» de performance d'eBay ont collectivement contribué à faire bouger l'aiguille, et elles se sont produites sur une période de temps. Les versions ont été introduites progressivement au cours de l'année, chaque version perdant des dizaines de millisecondes, atteignant finalement le point où eBay est maintenant:

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 Suite. En el caso de eBay, estas optimizaciones variaron desde cosas que requirieron poco esfuerzo hasta algunas que fueron avanzadas.

Vérifier Vitesse pour mille coupes pour plus d'informations et pour garder un œil sur les articles plus détaillés des ingénieurs eBay sur leur travail de performance dans un proche avenir.