Algorithmic tasks in the frontend. Examples and competition Yandex
Yesterday a new Yandex Blitz was launched - this time the competition will be of interest to interface developers. Holders of places from first to fifth, we will offer to get us in a simplified scheme: one section of the interview instead of four. Thus, Blitz remains the fastest way to get into Yandex. 3r373. 3r380. 3r373. 3r380. The tasks of the competition are again close to the combat production tasks - you will need not only the skills of the front-end, but also the knowledge of the algorithms. Register here , to have time to take part in the qualifying round. 3r373. 3r380. 3r373. 3r380. 3r314. 3r373. 3r380. 3r373. 3r380. Blitz is a good reason to talk about the history of algorithmic problems arising in the industrial frontend and how they differ from the competition ones. 3r373. 3r380. one of the old lectures . 3r373. 3r380. 3r373. 3r380. Another interesting challenge was the location of the thumbnails in the search results for Yandex.Kartinok. It was necessary to make the alignment of the flow of rectangular objects of the same height and different widths along the right edge. In the general case, this task has no solution, so it was allowed to change the original size of the picture (reduce and cut off), but so that the loss of information does not exceed some given reasonable threshold in percent. 3r373. 3r380. 3r373. 3r380. There were also tasks related to the development of a Yandex template engine known for the keywords XJST and BEMTHML. The main difficulty was to make it fairly fast, while maintaining the desired semantic expressiveness. Details about this can be found in numerous reports. Here are some of the first reports with details: 3r3339. events.yandex.ru/lib/talks/43
and 3r3341. events.yandex.ru/lib/talks/329
there are many others. 3r373. 3r380. 3r373. 3r380. All kinds of real-time processing systems, such as scrolling and dragging with a mouse, are also often made to reflect. We have to invent various algorithmic tricks so that the interface - at least subjectively for the user - looks fast if real actions are performed objectively for a long time. 3r373. 3r380. 3r373. 3r380. For example, in one of the first versions of Yandex. Mail you could drag almost all key elements onto each other: letters to folders, tags to letters, letters to tags, and even folders to letters. In the process, while the user “clamped” an object in his hand and drove them around the screen, it was necessary to highlight those elements to which he could “reset”. The naive implementation "in the forehead" was inhibited to the extreme. 3r373. 3r380. 3r373. 3r380.
Differences of real tasks from competitive 3r372. 3r373. 3r380. Tasks inside Yandex, as a rule, are solved in a command mode. The man is not left to himself, as in the competition. He can get help from colleagues and must dock his decision with the interests of other participants in the process. 3r373. 3r380. 3r373. 3r380. It may happen that you wrote a quick version, but most of your colleagues consider the code to be unreasonably difficult to understand, develop, and future support. In such cases, you have to look for compromises. Most often, team interaction is arranged as the sequential addition of something in a solution or as a simultaneous pair programming process. We almost never do the same thing in parallel, then to compare and choose the best. 3r373. 3r380. 3r373. 3r380. Another important difference is that the real code that we write exists and continues to be maintained for a long time. This is not a “made-and-forgotten” process, so long as the tests pass. It is important to remember that your code can continue to live - not only executed, but also edited - for many years after writing. 3r373. 3r380. 3r373. 3r380. 3r373. 3r380. You can easily find websites with pure jаvascript tasks on the Internet. This is essentially the same sport programming, just in a specific language. In addition, there is a format "code in the dark", when the layout is made up without viewing the result, blindly, you see only the code. Competitions like ours are not particularly common, because, due to the specifics of interface development, it is very difficult to select good tasks and make automatic checks for them. Yandex has historically developed a strong school of automatic front-end testing, including using the comparison of screenshots from real browsers. Based on these developments, we sought to make checks on the tasks in the competition. For us, this is also an experiment, but we are confident that it will work out, and we are already preparing to develop the topic further.
About other competitions on the frontend
It may be interesting
I am overwhelmed by your post with such a nice topic. Usually I visit your blogs and get updated through the information you include but today’s blog would be the most appreciable. Well done!
Took me time to understand all of the comments, but I seriously enjoyed the write-up. It proved being really helpful to me and Im positive to all of the commenters right here! Its constantly nice when you can not only be informed, but also entertained! I am certain you had enjoyable writing this write-up.