Frontend schlägt zurück: Top 10 (?) HolyJS 2018 Piter berichtet



Hallo Habru! Wir haben bereits Videos von HolyJS 2018 Piter-Berichten auf YouTube veröffentlicht, und für Sie haben wir (nicht ganz) eine traditionelle Auswahl der besten von ihnen getroffen, so die Besucher der Konferenz.

Wie üblich gibt es oben „Junior“ -Berichte mit der höchsten Bewertung am Ende. Dies bedeutet natürlich nicht, dass ein Bericht viel schlechter ist als ein anderer: Schätzungen der gesamten Sammlung im Bereich von 4,28 bis 4,56. Wenn Sie sich die Anzahl der Überprüfungen ansehen oder die Berechnungsmethode ändern, können sich die Orte leicht ändern. Im Allgemeinen alles sehen!

Unter dem Schnitt - und Videos der besten Berichte und Links zu ihren Präsentationen und Kurzbeschreibungen sowie einem Link zur vollständigen Wiedergabeliste.

Ein systematischer Front-End-Ansatz zur Geschwindigkeit: Online-Messungen


Sprecher: Andrey Prokopyuk
Ort: 11
Bewertung: 4,28 ± 0,08
Präsentation präsentieren


Überraschung! Heute haben wir nicht 10, sondern 11 Berichte, und dafür gibt es mehrere Gründe.

Erstens beträgt der Unterschied zwischen dem 11. und 10. Platz nur vier Hundertstelpunkte. Zweitens planten die Jungs von der „Yandex Speed ​​Group“ zunächst, einen Paarbericht zu erstellen, und trennten sich dann: Andrey ( Andre_487 ) sprach über Online und Alex über Offline-Messungen. Der Vollständigkeit halber wurden beide oben aufgeführt: Sie können sie als zwei Teile eines Ganzen betrachten.

Dies ist ein ausgezeichneter Bericht, um mit unserer Auswahl zu beginnen - er ist einfach, dynamisch, aber gleichzeitig nützlich. Es hilft Ihnen dabei, Metriken zu erstellen und die Geschwindigkeit des Produkts zu verstehen, indem Sie einige Dinge buchstäblich am Knie und ohne unnötige Analysen ausführen.

Wie einer der Konferenzbesucher es ausdrückte: "CI auf Steroiden von diesen Jungs!".



Das mobile Web wieder zum Leben erwecken


Sprecher: Imad Elyafi
Ort: 10
Bewertung: 4,28 ± 0,12
Präsentation präsentieren


Imad-Bericht von Pinterest darüber, wie die mobile Webversion eines Großprojekts wie Pinterest in 11 Wochen (erfolgreich!) Umgeschrieben werden kann. Ergebnis - Das Ergebnis liegt in der Nähe nativer Anwendungen ohne Verlust der Ladegeschwindigkeit.

Natürlich war der Weg dornig und schwierig - Imad erzählt anhand von Beispielen, wo sie mit Problemen umgehen mussten und wie sie es geschafft haben, sie zu lösen. Er wird erklären, warum das Team die mobile Version gewählt hat, wie die Startseite bearbeitet wird und wie die Site für eine 3G-Verbindung optimiert wurde, ohne die Synchronisation zu verlieren.



Debuggen von JS am Beispiel von Chrome DevTools


Sprecher: Alexey Kozyatinsky
Ort: 9
Bewertung: 4,28 ± 0,08
Präsentation präsentieren


Das Hauptthema des Berichts ist das, was sich im Webanwendungs-Debugger befindet. Alexey arbeitet „auf der anderen Seite der Barrikaden“ - im Chrome DevTools-Team und erstellt und verbessert dort JavaScript-Debugging-Tools. Es geht um genau das: Was der Browser beim Debuggen automatisch tun kann, welche Tools Freunde des Entwicklers sind, wie mit asynchronen Stacks und Speicherprofilen gearbeitet wird.

In dem Bericht beantwortet Alexey die Frage, warum die Haltepunkte in Dateien mit Quellenkarte erst nach dem erneuten Laden der Seite funktionieren, und stellt Stichproben und Instrumente gegenüber, wobei die Stärken und Schwächen der einzelnen hervorgehoben werden.

Der Bericht ist kurz, aber detailliert: Er enthält viele Parsing-Tools, viel Code und verspricht, Fehler zu beheben :)



Ein systematischer Ansatz für die Front-End-Geschwindigkeit: Offline-Messungen


Sprecher: Alexey Kalmakov
Ort: 8
Bewertung: 4,29 ± 0,08
Präsentation präsentieren


Der zweite Teil des Berichts über den Messansatz der Jungs von Yandex. Nun zu Offline-Messungen: völlig unterschiedliche Ansätze und völlig unterschiedliche Informationen. Beobachten Sie am besten beide Teile, um zu verstehen, was passiert und wie Sie Wissen außerhalb der internen Tools von Yandex anwenden können.

Alexey enthüllt die Vor- und Nachteile des Ansatzes seines Kollegen und spricht über die traurige Geschichte einer Veröffentlichung, über das Pulse-Tool, das beim Sammeln von Daten und Abfragen hilft und die Hauptprobleme der Offline-Datenerfassung identifiziert. Einfacher, lustiger und nützlicher Bericht.



Keynote: 30: Zu viel JavaScript


Sprecher: Ilya Klimov
Ort: 7
Bewertung: 4,30 ± 0,08
Präsentation präsentieren


Die letzte Motivations-Keynote erwies sich als sehr „einfach“, lebhaft und ziemlich humorvoll. Zumindest lohnt es sich, den Abschnitt über die Kategorisierung von Schulungen zu lesen. Ilya machte einen umfangreichen Zeitplan für die Wichtigkeit und Relevanz von Wissen, den unsere Zuhörer wirklich mochten.

Dieser Bericht ist die Antwort auf drei Fragen, die Ilya jede Woche mehrmals von seinen Schülern gestellt hat:

  • Wie lernst du, was du brauchst, nicht Hype?
  • Wie strukturiere ich Informationen für die schnellste Entwicklung?
  • Wo laufen?




Keynote: Flackernde Technologie oder Ingenieurwesen des 21. Jahrhunderts


Sprecher: Maxim Yuzva
Ort: 6
Bewertung: 4,41 ± 0,07
Präsentation präsentieren


Wenn der Code nicht argumentiert, keine unnötigen Fragen stellt (na ja, fast) und keine Notwendigkeit besteht, mit ihm zu verhandeln, sind die Dinge mit den Menschen viel komplizierter - jeder hat seine eigenen Macken, Bedürfnisse und so weiter. Darüber - Maxim's Bericht im TED-Stil, der am ersten Tag abgeschlossen wurde.

Maxim analysiert den Teil der Arbeit, der außerhalb von Holivars liegt, über Frameworks, Paradigmen und außerhalb der ewigen Front-End-Aufregung. Beispielsweise haben die Schüler nützliche Tipps zur Auswahl von Technologien, zur korrekten Beantwortung von Fragen und zur Interaktion in einem Team gegeben.

Maxim lehrt den Verkauf von Refactoring für ein Projekt, überzeugt Kollegen davon, Linter zu implementieren, und macht sich keine Gedanken mehr darüber, was sie schreiben sollen, Angular, React oder Vue.

Dieser Bericht beantwortet die Frage: "Könnte Elon Musk eine Rakete starten und landen, wenn er JavaScript, React oder Angular am besten auf der Welt kennt?" Spoiler: Ja. Aber js zu kennen ist hier nicht der Punkt. “ Schließlich müssen Sie Softskills herunterladen, in einem Team kommunizieren, Ihre Sichtweise beweisen und vieles mehr. Sie können Code perfekt schreiben, aber die Diskussion an jemanden verlieren, der eine gute Sprache hat. Und daran muss man sich erinnern.



Haupt-Thread-Zerlegung in Node.js zur Erhöhung des Durchsatzes


Sprecher: Nikolay Matvienko
Ort: 5
Bewertung: 4,42 ± 0,09
Präsentation präsentieren


Jedes Unternehmen verwendet Node.js auf seine eigene Weise: von Baustilen, SSRs und Vorlagen über Microservices bis hin zur Kommunikation mit Datenbanken. Eines haben alle gemeinsam: einen geladenen Haupt-Thread. Nikolay zeigt anhand von Node.js als Beispiel in E-Commerce-Projekten großer Unternehmen, wie der Haupt-Thread effizient und schrittweise entlastet werden kann, um den Durchsatz zu erhöhen.

Hierfür gibt es viele Tools: Anmelden in einem separaten Stream, Sammeln von Metriken in einem separaten Prozess, Starten von Mitarbeitern für die Arbeit mit den ressourcenintensivsten Aufgaben.

Tests, spezifische Vergleichszahlen, Grafiken - Nikolai analysiert jedes Tool detailliert und mit Bedacht. Harkorny, aber sehr nützlicher Bericht, der nicht zu übersehen ist.



Arbeiten mit abstrakten JavaScript-Syntaxbäumen


Sprecher: Kirill Cherkashin
Ort: 4
Bewertung: 4,44 ± 0,07
Präsentation präsentieren


Der in Moskau geborene Kirill lebt heute in New York und arbeitet bei Google für Firebase. Außerdem organisiert er den größten Angular-Mitap der Welt. Er spricht über einfache und „schmerzhafte“ Beispiele, wie Sie Ihren Code richtig analysieren und den eines anderen transformieren können.

Warum müssen Sie Ihren Code analysieren? Zum Beispiel, um das vergessene console.log vor dem Festschreiben zu finden. Was aber, wenn Sie die Funktionssignatur in Hunderten von Einträgen im Code ändern müssen? Werden reguläre Ausdrücke hier zurechtkommen?

All diese Fragen beantwortet Cyril in seinem einfachen, aber sehr nützlichen Bericht. Er untersucht Ansätze zum Parsen und Transformieren von JavaScript-Quellcode basierend auf dessen Parsen und Arbeiten mit dem resultierenden abstrakten Syntaxbaum. Beispiele sind Babel und ESLint.



EME? Cdm? DRM? CENC? IDK!


Sprecher: Sebastian Golasch
Ort: 3
Bewertung: 4,46 ± 0,17

Präsentation präsentieren


Drei-Wörter-Talk - Netflix Reverse Engineering!
Ein sehr interessanter Bericht, der die technischen Details hinter einer Reihe von beängstigenden Abkürzungen des DRM-Stacks enthüllt: EME (Encrypted Media Extension), CDM (Content Decryption Modules), Widevine und DRM (Digital Rights Management).

In einem Bericht wird Sebastian die wichtigsten Punkte im Zusammenhang mit dem Schutz von Online-Videos behandeln: Streaming, Herunterladen, Bekämpfung von Piraterie, Lizenzierung und viele andere. Er erklärt Ihnen, wie Sie Ihren eigenen Videoplayer für Netflix erstellen und sich mit der Architektur des Dienstes befassen.

Ein Bericht voller technischer Details, der möglicherweise nicht für jeden geeignet ist, aber entweder die Grundlagen der Arbeit mit DRM einführt oder denjenigen etwas Nützliches vorschlägt, die täglich mit der Arbeit von Streaming-Diensten konfrontiert sind.



Schmutzige kleine Tricks aus den dunklen Ecken des E-Commerce


Sprecher: Vitaliy Fridman
Ort: 2
Bewertung: 4,51 ± 0,11
Präsentation präsentieren



Vitaliy ist eine Person, die einfach über das Wichtige spricht. Zum Beispiel darüber, was in einem E-Commerce-Projekt schief gehen kann.

Ja, Probleme können buchstäblich überall auftreten: von der Auswahl eines Produkts über das Hinzufügen zum Warenkorb bis hin zu einem Brief mit Bestätigung und Lieferung der Waren. Jeder Schritt sollte sorgfältig auf mögliche Fehler und Missverständnisse überprüft werden.

In dem Bericht zeigt Vitaliy eine Vielzahl von Beispielen dafür, wie schlecht E-Commerce funktioniert (für die Conversion oder in Bezug auf Benutzer), mit echten Beispielen und Corporate Humor.

In diesem Bericht wird Vitaliy überlegen, wie Sie die Conversion steigern und einfach Ihre Benutzererfahrung mit einigen kleinen Dingen verbessern können. Wie üblich - Vitalys Bericht ist wunderschön, einfach (trotz der englischen Sprache) und sowohl für UX-Designer als auch für Entwickler sehr nützlich.

Viele positive Bewertungen von Besuchern sagen eines aus: Jeder Zuhörer und Zuschauer findet in Vitalys Bericht etwas Nützliches für die Arbeit.



Keynote: Neue Abenteuer im Frontend, Staffel 2


Sprecher: Vitaliy Fridman
Ort: 1
Bewertung: 4,56 ± 0,05
Präsentation präsentieren


"Aber er hat es nicht erraten, es summt in beiden Ohren!" Wenn Sie aufgrund des Eröffnungsbildes des Postens versucht haben, den Platz von Vitaliy Fridman zu erraten, haben Sie im Allgemeinen kaum erraten, dass er es geschafft hat, die beiden oberen Positionen gleichzeitig einzunehmen.

Wenn eine der bemerkenswertesten Aufführungen des vorherigen HolyJS Vitaliy Fridmans Bericht „Neue Abenteuer im Responsive Web Design“ war, dann wurde seine „Fortsetzung“ die beste bei HolyJS Piter 2018!

Wenn Sie das Smashing Magazine leiten, lernen Sie viele Feinheiten, Komplexitäten und schmutzige Tricks des Frontends kennen - der Bericht wird also eine Vielzahl von Themen abdecken. Wie der Autor warnt, "können Sie nicht" wiedererkennen ", was Sie lernen, und wir sind nicht verantwortlich für Ihre nachfolgenden Alpträume." Wie einer der Zuhörer sagte: "Akrobatische Tricks zur Optimierung der Arbeit des Frontends werden immer nützlich sein!" Wir können nicht widersprechen.
Wenn diese Berichte (und andere aus der vollständigen Wiedergabeliste ) von Interesse sind, beachten Sie bitte: HolyJS Moscow 2018 findet vom 24. bis 25. November statt .

Die aktuellsten Informationen über das Programm finden Sie immer auf der Website. Dort können Sie auch Tickets kaufen. Ab dem 1. November steigt der Preis auf den endgültigen Preis. Jetzt ist die letzte Möglichkeit zum Sparen.

Source: https://habr.com/ru/post/de428085/


All Articles