Algorithmische Probleme im Frontend. Yandex Beispiele und Wettbewerb

Gestern wurde ein neues Yandex.Blitz gestartet - diesmal wird der Wettbewerb für Interface-Entwickler interessant sein. Für die Inhaber des ersten bis fünften Platzes bieten wir Ihnen an, nach einem vereinfachten Schema zu uns zu gelangen: ein Interviewabschnitt anstelle von vier. Somit bleibt Blitz der schnellste Weg zu Yandex.

Die Aufgaben des Wettbewerbs sind wieder nah an der Bekämpfung von Produktionsaufgaben - Sie benötigen nicht nur Front-End-Fähigkeiten, sondern auch Kenntnisse über Algorithmen. Registrieren Sie sich hier , um an der Qualifikationsrunde teilzunehmen.



Blitz ist ein guter Grund, über die Geschichte der algorithmischen Probleme zu sprechen, die im industriellen Frontend auftreten, und wie sie sich von denen der Konkurrenz unterscheiden.

Über Aufgaben


Algorithmisch gesättigte Aufgaben bei der Entwicklung von Schnittstellen in Yandex sind immer entstanden. Ich kann mich an Beispiele von 2005-2006 erinnern. Eine dieser Aufgaben war ein System zur Arbeit mit abstrakten Ereignissen. Es war erforderlich, einen Kernel zu erstellen, der das Anhängen von Handlern (durch eine Funktion angegeben) an beliebige Ereignisse (durch eine Zeichenfolge angegeben) ermöglicht. Danach wird ein bestimmtes Ereignis ausgelöst und die Handlerbindung entfernt. Eine weitere Komplikation bestand darin, dass die drei aufgeführten Hauptoperationen so schnell wie möglich ausgeführt werden sollten. Darüber gibt es sogar einen Abschnitt in einem der alten Berichte .

Eine weitere interessante Aufgabe betraf die Position von Miniaturansichten in Yandex.Picture-Suchergebnissen. Es war notwendig, den Fluss von rechteckigen Objekten gleicher Höhe und unterschiedlicher Breite am rechten Rand auszurichten. Im allgemeinen Fall hat dieses Problem keine Lösung, so dass die ursprüngliche Bildgröße (verkleinern und zuschneiden) geändert werden konnte, der Informationsverlust jedoch einen bestimmten angemessenen Schwellenwert in Prozent nicht überschreitet.

Es gab auch Aufgaben im Zusammenhang mit der Entwicklung der Yandex-Vorlagen-Engine, die für die Schlüsselwörter XJST und BEMTHML bekannt ist. Die Hauptschwierigkeit bestand darin, es schnell genug zu machen und dabei die gewünschte semantische Ausdruckskraft beizubehalten. Details dazu finden Sie in zahlreichen Berichten. Hier sind einige der ersten Berichte mit Details: events.yandex.ru/lib/talks/43 und events.yandex.ru/lib/talks/329 , es gibt viele andere.

Alle Arten von Echtzeitverarbeitungssystemen, beispielsweise beim Scrollen und Ziehen mit der Maus, müssen häufig reflektieren. Sie müssen sich verschiedene algorithmische Tricks einfallen lassen, damit die Benutzeroberfläche - zumindest subjektiv für den Benutzer - schnell aussieht, wenn die tatsächlichen Aktionen über einen langen Zeitraum objektiv ausgeführt werden.

In einer der ersten Versionen von Yandex.Mail konnten beispielsweise fast alle Schlüsselelemente aufeinander gezogen werden: Buchstaben in Ordner, Beschriftungen auf Buchstaben, Buchstaben auf Beschriftungen und sogar Ordner auf Buchstaben. Während der Benutzer das Objekt „in der Hand“ hielt und es über den Bildschirm fuhr, mussten dabei die Elemente hervorgehoben werden, auf denen es „zurückgesetzt“ werden konnte. Die naive Erkenntnis "in der Stirn" verlangsamte sich zur Unmöglichkeit.

Unterschiede zwischen realen und wettbewerbsorientierten Aufgaben


Aufgaben in Yandex werden in der Regel im Teammodus gelöst. Der Mensch ist nicht wie bei einem Wettbewerb auf sich allein gestellt. Er kann Hilfe von Kollegen erhalten und sollte die Art und Weise seiner Entscheidung mit den Interessen anderer Teilnehmer des Prozesses in Einklang bringen.

Es mag sich herausstellen, dass Sie eine schnelle Version geschrieben haben, aber die meisten Ihrer Kollegen halten den Code für unangemessen schwierig für das Verständnis, die Entwicklung und die zukünftige Unterstützung. In solchen Fällen müssen Kompromisse angestrebt werden. In den meisten Fällen wird die Teaminteraktion als sequentielle Ergänzung einer Lösung oder als gleichzeitiger Prozess der Paarprogrammierung konzipiert. Wir machen fast nie dasselbe parallel, um später die besten zu vergleichen und auszuwählen.

Ein weiterer wichtiger Unterschied besteht darin, dass der von uns geschriebene echte Code existiert und noch lange unterstützt wird. Dies ist kein "Do-Forget" -Prozess und wenn nur die Tests bestanden werden. Es ist wichtig zu bedenken, dass Ihr Code noch viele Jahre nach dem Schreiben weiterleben kann - nicht nur ausgeführt, sondern auch bearbeitet.

Über andere Frontend-Wettbewerbe


Sie können leicht auf den Internetseiten mit Aufgaben nur in JavaScript finden. Dies ist im Wesentlichen das gleiche Sportprogramm, nur in einer bestimmten Sprache. Darüber hinaus gibt es das Format „Code im Dunkeln“. Wenn das Layout auferlegt wird, ohne das Ergebnis anzuzeigen, wird blind nur der Code angezeigt. Wettbewerbe wie unsere sind nicht besonders verbreitet, da es aufgrund der Besonderheiten der Schnittstellenentwicklung sehr schwierig ist, gute Aufgaben zu übernehmen und sie automatisch zu überprüfen. Yandex hat in der Vergangenheit eine starke Schule für das automatische Testen des Frontends entwickelt, einschließlich des Vergleichs von Screenshots von echten Browsern. Basierend auf diesen Entwicklungen haben wir versucht, Aufgabenprüfungen im Wettbewerb durchzuführen. Dies ist auch ein Experiment für uns, aber wir sind sicher, dass es funktionieren wird, und wir bereiten uns bereits darauf vor, das Thema weiterzuentwickeln.

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


All Articles