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 Plus para una BenutzererfahrungEl 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 Plus más rápida.
Die Geschwindigkeit war a unternehmensweite Initiative für eBay im Jahr 2019, mit vielen Teams entschlossen, die Website und Apps für Benutzer so schnell wie möglich zu machen. Tatsächlich, Für jede Verbesserung der Ladezeit der Suchseite um 100 Millisekunden verzeichnete eBay einen Anstieg der Anzahl "In den Warenkorb" um 0,51 TP1T.
100em
Verbesserte Ladezeit
0,5%
Die Anzahl "In den Warenkorb" wurde erhöht
Durch die Annahme von Leistungsbudgets (abgeleitet nach Durchführung einer Wettbewerbsstudie mit dem Chrome User Experience Report) und mit dem Fokus auf benutzerzentrierte Leistungskennzahlen konnte eBay die Geschwindigkeit der Website erheblich verbessern.
Verbesserungen der eBay-Geschwindigkeit.
… Und Ihre Daten aus dem Chrome User Experience Report heben diese Verbesserungen ebenfalls hervor.
Chrome User Experience Report-Daten für First Contentful Paint und First Input Delay für eBay.com.
Es liegt noch viel Arbeit vor uns, aber hier sind die bisherigen eBay-Erkenntnisse.
Webleistung "Ausfälle"
Die Verbesserungen, die eBay vorgenommen hat, wurden durch die Verkleinerung oder "Kürzung" (in Größe und Zeit) verschiedener Einheiten ermöglicht, die an der Reise eines Benutzers beteiligt sind. Dieser Beitrag behandelt Themen, die für die Webentwickler-Community im Allgemeinen relevant sind, und nicht eBay-spezifische Themen.
Reduzieren Sie die Nutzlast aller Textressourcen
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 Plus, 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 Plus, 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 Plus 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.
Der "Schnitt" hier sind die verschwendeten Bytes in der Antwortnutzlast.
Optimización de la ruta crítica para el InhaltEl 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, Plus de la mitad superior de la página
Nicht alle Pixel auf dem Bildschirm sind gleich wichtig. Der Inhalt oberhalb der Falte es ist kritischer als etwas unterhalb der Falte. Native und Webanwendungen sind sich dessen bewusst, aber was ist mit Diensten? Die Servicearchitektur von EBay hat eine Schicht namens
Erleben Sie Dienstleistungen, mit denen die Frontends (native Anwendungen und Webserver) kommunizieren. Diese Ebene ist speziell so konzipiert, dass sie auf Ansichten oder Geräten und nicht auf Entitäten basiert, z. B. auf Artikeln, Benutzern oder Bestellungen. Dann führte eBay das Konzept des kritischen Pfades für Experience Services ein. Wenn eine Anfrage an diese Dienste geht, arbeiten sie daran, die Inhaltsdaten sofort aus der oberen Hälfte der Seite abzurufen und andere Upstream-Dienste parallel aufzurufen. Sobald die Daten fertig sind, werden sie sofort gelöscht. Die Daten am Ende der Seite werden in einem späteren Block gesendet oder faul geladen. Das Ergebnis: Benutzer können Inhalte in der oberen Hälfte der Seite schneller sehen.
Der "Cutoff" ist hier die Zeit, die die Dienste für die Anzeige relevanter Inhalte aufwenden.
Bildoptimierungen
Die Bilder sind einer der größten Mitwirkenden beim Aufblähen von Seiten. Auch kleine Optimierungen sind sehr nützlich. eBay hat zwei Optimierungen für die Bilder vorgenommen.
Zunächst standardisierte eBay das WebP-Bildformat für Suchergebnisse auf allen Plattformen, einschließlich iOS, Android und unterstützte Browser. Die Suchergebnisseite ist die Seite mit den meisten Bildern bei eBay, und sie verwendeten bereits WebP, jedoch nicht in einem konsistenten Muster.
Imágenes WebP que se muestran en BrowserConcepto de Navegadores¿Qué son los Navegadores?Los Navegadores son herramientas informáticas que utilizamos para, normalmente, navegar por Internet y visitar cualquier página web, al mismo tiempo de para hacer otras tareas como ver documentos, observar vídeos o reproducir contenido multimedia de cualquier tipo. Son un tipo de software sencillamente usual y bastante utilizado hoy en día.Insistimos en que es algo que se utiliza con mucha frecuencia, puesto que moverse por Internet Plus compatibles en eBay.com.
Zweitens wurde, obwohl die eBay-Auflistungsbilder stark optimiert sind (sowohl in Größe als auch Format), nicht die gleiche Genauigkeit auf die ausgewählten Bilder angewendet (z. B. das oberste Modul in der
Startseite). eBay hat viele handverlesene Bilder, die über verschiedene Tools hochgeladen werden. Früher waren Optimierungen vom Uploader abhängig, jetzt setzt eBay die Regeln innerhalb der Tools durch, sodass alle hochgeladenen Bilder entsprechend optimiert werden.
Der "Schnitt" hier sind verschwendete Bildbytes, die an Benutzer gesendet werden.
Vorausschauende Vorerfassung von statischen Vermögenswerten
Eine Benutzersitzung bei eBay ist nicht nur eine Seite. Es ist ein Fluss. Der Ablauf kann beispielsweise eine Navigation von der Startseite zu einer Suchseite zu einer Artikelseite sein. Warum helfen sich die Seiten im Fluss nicht gegenseitig? Dies ist die Idee des prädiktiven Prefetch, bei dem eine Seite die statischen Assets vorab abruft, die für die nächste wahrscheinliche Seite erforderlich sind.
Con la captación previa predictiva, cuando un usuario navega a la página prevista, los activos ya están en la ZwischenspeicherUn 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 Plus von BrowserUn 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 Plus. 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 Plus 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é.
Der "Cutoff" ist hier die Netzwerkzeit für die statischen CSS- und JavaScript-Assets bei der ersten Navigation.
Vorherige Erlangung der besten Suchergebnisse
Wenn ein Benutzer eBay durchsucht, deutet die eBay-Analyse darauf hin, dass der Benutzer höchstwahrscheinlich zu einem Artikel in den Top-10-Suchergebnissen navigiert. EBay holt nun die Artikel aus der Suche und hält sie bereit, wenn der Benutzer sie durchsucht. Die Voraufnahme erfolgt auf zwei Ebenen.
El primer nivel ocurre en el lado del ServerLos 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 Plus, 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: EindrückeConcepto 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 Plus de página, capacidad, artículos de subasta, etc. Puedes aprender más sobre esto en Präsentation des LinkedIn Performance Engineering Meetings, 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 Plus detallada sobre el tema de los ingenieros de eBay.
Der "Cutoff" kann hier die Serververarbeitungszeit oder die Netzwerkzeit sein, je nachdem, wo das Element gespeichert ist.
Eifriger Download von Suchbildern
Wenn auf der Suchergebnisseite eine Abfrage auf hoher Ebene ausgegeben wird, passieren zwei Dinge. Einer ist der Abruf- / Sortierschritt, bei dem die relevantesten Elemente zurückgegeben werden, die der Abfrage entsprechen. Der zweite Schritt besteht darin, die zurückgerufenen Artikel mit zusätzlichen Informationen zum Benutzerkontext zu erweitern, z. B. Versandkosten. eBay sendet jetzt sofort die ersten 10 Artikelbilder in einem Snippet zusammen mit der Kopfzeile an den Browser, sodass der Download beginnen kann, bevor der Rest des Markups eintrifft. Infolgedessen werden Bilder jetzt schneller angezeigt. Diese Änderung wird global für die Webplattform implementiert.
Der "Cutoff" hier ist die Download-Startzeit für Bilder aus Suchergebnissen.
Edge-Caching für Autosuggestion-Daten
Wenn Benutzer Buchstaben in das Suchfeld eingeben, werden Vorschläge angezeigt. Diese Vorschläge ändern sich für Buchstabenkombinationen mindestens einen Tag lang nicht. Sie sind ideale Kandidaten, um zwischengespeichert und bedient zu werden CDN (für maximal 24 Stunden), anstatt dass Anfragen ein Rechenzentrum erreichen. Internationale Märkte profitieren insbesondere vom CDN-Caching.
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 Benutzeroberfläche 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 Plus 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.
Der "Cutoff" hier ist die Netzwerklatenz und die Serververarbeitungszeit für automatische Vorschläge.
Edge-Caching für nicht erkannte Homepage-Benutzer
Für die Webplattform ist der Inhalt der Startseite für nicht erkannte Benutzer für eine bestimmte Region identisch. Dies sind Benutzer, die eBay zum ersten Mal verwenden oder eine neue Sitzung starten, sodass keine Personalisierung erfolgt. Obwohl sich die Motive auf der Startseite häufig ändern, ist immer noch Platz für das Caching.
eBay hat beschlossen, nicht erkannte Benutzerinhalte (HTML) in seinem Umkreisnetzwerk zwischenzuspeichern (PoPs) für kurze Zeit. Neue Benutzer können jetzt Homepage-Inhalte von einem nahe gelegenen Server anstatt von einem entfernten Rechenzentrum abrufen. eBay experimentiert immer noch damit auf internationalen Märkten, wo es den größten Einfluss haben wird.
Der "Schnitt" ist hier wiederum sowohl die Netzwerklatenz als auch die Serverdurchsatzzeit für nicht erkannte Benutzer.
Optimierungen für andere Plattformen
Verbesserungen der nativen App-Analyse
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 AlgorithmusUn 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 Plus de análisis eficiente que optimiza el contenido que debe mostrarse de inmediato.
Benutzer können Inhalte jetzt schneller anzeigen. Für die Android-App beginnt eBay mit der Initialisierung der Suchansichts-Controller, sobald der Benutzer das Suchfeld eingibt (iOS hatte diese Optimierung bereits). Bisher geschah dies erst, nachdem Benutzer auf die Schaltfläche "Suchen" geklickt hatten. Jetzt können Benutzer schneller auf ihre Suchergebnisse zugreifen. Der "Cutoff" ist hier die Zeit, die Geräte damit verbringen, relevante Inhalte anzuzeigen.
Verbesserungen der nativen App-Startzeit
Dies gilt für Neuanfang Zeitoptimierungen für native Anwendungen, insbesondere Android. Wenn eine Anwendung kalt gestartet wird, erfolgt eine große Menge an Initialisierung sowohl auf Betriebssystem- als auch auf Anwendungsebene. Durch Reduzieren der Initialisierungszeit auf Anwendungsebene können Benutzer den Startbildschirm schneller sehen. eBay hat einige Profile erstellt und festgestellt, dass nicht alle Initialisierungen zum Anzeigen von Inhalten erforderlich sind und dass einige träge durchgeführt werden können.
Noch wichtiger ist, dass eBay feststellte, dass ein Analyseanruf eines Drittanbieters blockiert wurde, der die Anzeige auf dem Bildschirm verzögerte. Durch das Entfernen und Blockieren des blockierenden Anrufs konnten die Kaltstartzeiten weiter verbessert werden. Der "Schnitt" hier ist unnötige Startzeit für native Anwendungen.
Schlussfolgerungen
Alle Leistungskürzungen von eBay haben gemeinsam dazu beigetragen, die Nadel zu bewegen, und dies geschah über einen bestimmten Zeitraum. Die Veröffentlichungen wurden im Laufe des Jahres schrittweise eingeführt, wobei jede Veröffentlichung um zehn Millisekunden zurückging und schließlich den Punkt erreichte, an dem eBay jetzt ist:
Die Auswirkungen der Geschwindigkeitsanstrengungen von eBay auf die Feldmetriken im Laufe der Zeit, wie in der Abbildung dargestellt Chrome UX-Berichts-Dashboard.
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 Plus. En el caso de eBay, estas optimizaciones variaron desde cosas que requirieron poco esfuerzo hasta algunas que fueron avanzadas.
Überprüfen Geschwindigkeit pro tausend Schnitte Für weitere Informationen und um in naher Zukunft nach detaillierteren Artikeln von eBay-Ingenieuren über ihre Leistungsarbeit Ausschau zu halten.
