Pull to refresh
12
0
Драпеза Олег @SuperOleg39ru

Front-end разработчик

Send message

Как yarn v3 и философия Zero Installs помогли нам сократить длительность ci/cd пайплайна в 3 раза

Level of difficulty Medium
Reading time 8 min
Views 6.6K

Всем привет, меня зовут Фёдор — я руководитель фронтенд-разработки на проекте Smartbot Pro в компании KTS

Наш проект — конструктор ботов для социальных сетей, в котором алгоритм бота представлен в виде визуального графа. Конструктор включает большое количество интеграций. Недавно на проекте остро встал вопрос оптимизации наших ci/cd пайплайнов, потому что релиз мог занимать от 4 до 18 минут.

В статье я расскажу, как мы решили эту проблему с помощью оптимизации сборки Docker-образа, установки зависимостей и сокращения количества шагов пайплайна. Это может быть полезно тем, кто столкнулся с проблемой долгих пайплайнов.

Читать далее
Total votes 33: ↑33 and ↓0 +33
Comments 2

Как мы отказались от JPEG, JSON, TCP и ускорили ВКонтакте в два раза

Reading time 24 min
Views 166K

На протяжении всей жизни мне приходится экономить вычислительные и сетевые ресурсы: сначала были компьютеры с 300 кГц (кило — не гига!) и 32 Кбайт RAM, интернет по dial-up. Потом я решал олимпиадные задачки. Теперь имею дело с терабайтами трафика и 50 млрд событий в сутки. И хотя современные телефоны в 1 000 раз мощнее любого оборудования двадцатилетней давности, я до сих пор оптимизирую. Думал даже, что это со мной что-то не так. Но потом понял, что все постоянно что-нибудь оптимизируют. 

Эта статья в меньшей степени о том, почему нужно бороться за производительность, и в большей о том, на что сейчас стоит заменить устаревший стек из JPEG, JSON, gzip и TCP — и как это сделать. 

Спойлер: у нас есть решение и мы его не только показываем — ссылки на open source в конце статьи.

Читать далее
Total votes 435: ↑423 and ↓12 +411
Comments 300

Разбираемся в сортах реактивности

Reading time 27 min
Views 35K

Здравствуйте, меня зовут Дмитрий Карловский и я… прилетел к вам на турбо-реактивном самолёте. Основная суть реактивного двигателя изображена на картинке.



Тут, казалось бы, хаотичное взаимодействие между молекулами, приводит к тому, что улетающие молекулы опосредованно передают импульс корпусу двигателя. Что ж, давайте подумаем, как реактивные принципы решают или наоборот усугубляют проблемы в программировании. Сравним различные подходы к реактивному программированию. И вытащим на поверхность все их подводные камни.


Это — текстовая расшифровка выступления на SECON.Weekend Frontend'21. Вы можете посмотреть видео запись, прочитать как статью, либо открыть в интерфейсе проведения презентаций.

Читать дальше →
Total votes 66: ↑58 and ↓8 +50
Comments 55

Масштабируем WebSocket соединения на Go

Reading time 21 min
Views 30K
Мессенджер Авито – это:

  • 12 m уникальных пользователей в месяц;
  • Версии для всех современных платформ (Web, iOS, Android);
  • Достаточно нагруженное приложение – около 800 тысяч подключений онлайн по WebSocket (основной протокол общения с пользователями).

Александр Емелин из компании Авито — автор проекта Centrifugo — open-source сервера real-time сообщений, где основной протокол передачи данных как раз WebSocket. Сервер используется в проектах Mail.Ru (в том числе в Юле), а также во внутренних проектах Badoo, ManyChat, частично Авито и за рубежом (например, Spot.im). Сейчас сервер базируется на доступной всем Go-разработчикам библиотеке Centrifuge.

На конференции Golang Conf 2019 Александр рассказал, как команда Авито решала проблемы при работе с WebSocket — как про детали, касающиеся Go в частности, так и вообще про работу с большим количеством постоянных соединений.


Читать дальше →
Total votes 51: ↑50 and ↓1 +49
Comments 1

Оптимизация производительности фронтенда. Часть 2. Event loop, layout, paint, composite

Reading time 11 min
Views 47K

Ночь. Стук в дверь. Открыть. Стоят двое. "Верите ли вы в Event loop, нашу главную браузерную цепочку?" Вздохнуть. Закрыть дверь. Лечь досыпать. До начала рабочего дня еще 4 часа. А там уже ивент лупы, лейауты и прочая радость…


В первой части мы говорили о первой загрузке и работе с ресурсами. Сегодня я расскажу о второй части оптимизации производительности фронтенда. О том, что происходит с нашей страницей, когда она загружена, на что уходит процессорное время и что с этим делать. Ключевые слова: event loop, paint \ repaint, layout \ reflow, composite.


Читать дальше →
Total votes 22: ↑21 and ↓1 +20
Comments 5

Оптимизация производительности фронтенда. Часть 1. Critical Render Path

Reading time 14 min
Views 41K

Здравствуйте. Меня зовут Ник, я фронтенд разработчик (жидкие аплодисменты). Кроме того, что я пишу код, я преподаю в Школе программистов hh.ru.


Записи наших лекций от 2018-2019 учебного года можно посмотреть на youtube


В этом году у меня была лекция про оптимизацию производительности фронтенда, и я решил превратить ее в текстовый формат. Материал получился большим, так как лекция была длительностью 3 часа. Поэтому получился текстовый альманах.



Вот презентация для тех, кому неохота читать лонгрид, но при этом хочется иметь базовое представление о контенте.


Лонгридом можно пользоваться как справочником, чтобы не читать за один присест. Вот список тем, которые мы затронем:


  1. Зачем думать о производительности
  2. FMP, TTI + подробнее в докладе
  3. Critical render path, DOM, CSSOM, RenderTree
  4. Шаги по улучшению производительности первой загрузки + подробнее в докладе
Читать дальше →
Total votes 19: ↑18 and ↓1 +17
Comments 10

Как перезапустить закон Мура программными методами. Ускорение софта в тысячи раз

Reading time 8 min
Views 56K
Профессор Никлаус Вирт был прав. Создатель языка Pascal, соавтор технологии структурного программирования, лауреат премии Тьюринга в 1995 году заметил:

«Замедление программ происходит куда быстрее, чем ускорение компьютеров»


С тех пор это высказывание считается законом Вирта. Он фактически нивелирует закон Мура, согласно которому количество транзисторов в процессорах удваивается примерно с 1965 года. Вот что пишет Вирт в статье «Призыв к стройному софту»:

«Около 25 лет назад интерактивный текстовый редактор умещался всего в 8000 байт, а компилятор в 32 килобайта, тогда как их современные потомки требуют мегабайтов. Стало ли всё это раздутое программное обеспечение быстрее? Нет, совсем наоборот. Если бы не в тысячу раз более быстрое железо, то современное программное обеспечение было бы совершенно непригодным».

С этим трудно не согласиться.
Читать дальше →
Total votes 90: ↑76 and ↓14 +62
Comments 468

12 советов по внедрению TypeScript в React-приложениях

Reading time 9 min
Views 36K
TypeScript — стандарт современной фронтенд-разработки. Согласно исследованиям State of JavaScript, TS вызывает явный интерес у программистов. По данным опроса за 2019 год, почти 60% респондентов пробовали TS и продолжают использовать, 22% не пробовали и желают изучить.

Эта статья — сборник советов о том, как внедрить и улучшить использование TypeScript. Первая половина советов общая, касающаяся подходов и инфраструктуры. Вторая — несколько особо полезных фишек языка.


Читать дальше →
Total votes 60: ↑60 and ↓0 +60
Comments 43

Остановитесь!!! Вам не нужны микросервисы

Reading time 7 min
Views 82K

Идет 2020 год. Если вам нужно пояснение, что такое микросервисы — лучше потратьте свое драгоценное время на что-то другое. Но если вы впечатлены историями успеха о микросервисах и хотите нырнуть в "панацею" с головой — продолжайте читать. Прошу прощения, будет немного длинновато (не очень, прим. переводчика).

Читать дальше →
Total votes 97: ↑92 and ↓5 +87
Comments 249

Синтетический мониторинг производительности

Reading time 7 min
Views 19K

Синтетический мониторинг производительности


Благодаря внедрению клиентского мониторинга производительности, мы с полной уверенностью можем диагностировать проблемные места проекта и составить план для дальнейшей оптимизации.


Однако было бы неплохо иметь инструмент, который еще на этапе разработки позволял бы выявлять возможные регрессы производительности. Именно так родилась идея о создании синтетического мониторинга.

Читать дальше →
Total votes 17: ↑17 and ↓0 +17
Comments 3

Клиентский мониторинг производительности

Reading time 18 min
Views 21K

Клиентский мониторинг производительности


Привет, Хабр! Меня зовут Влад, я лид направления Web Performance в Тинькофф.


В этом цикле статей я расскажу о подходах, инструментах и показателях, с помощью которых мы наблюдаем за производительностью наших проектов. Но для начала пара слов о том, почему производительность — это важно.


Производительность как один из атрибутов качества программного обеспечения, в значительной степени может влиять на успех конечного продукта. Существует множество историй о том, как даже самые небольшие оптимизации положительно сказывались на опыте взаимодействия и бизнес-показателях компании.


Ведущие игроки IT-индустрии продолжают обращать внимание на важность производительности, проводят масштабные исследования и эксперименты, разрабатывают новые концепции, инструменты и API. А в ближайшем будущем Google и вовсе будет учитывать основные показатели производительности в поисковой выдаче.


Пользователям нравятся отзывчивые интерфейсы, а бизнесу — прибыльные проекты. И если производительность играет в этом не последнюю роль, то почему бы не заняться ее оптимизацией?

Читать дальше →
Total votes 30: ↑30 and ↓0 +30
Comments 1

Время учиться: дайджест бесплатных образовательных материалов от Mail.Ru Group

Reading time 10 min
Views 112K

Кадр из к/ф «Операция Ы и другие приключения Шурика»

Как говорят, «кризис — пора возможностей». И поэтому сейчас самое время начать вкладывать в саморазвитие, осваивать новую профессию или повышать свою квалификацию. Займитесь изучением языков программирования, обретением навыков разработки, тестирования и вообще всячески прокачивайте свой IT-скилл. Ведь чем больше вы знаете, тем прочнее будете стоять на ногах. А чтобы вам было легче сориентироваться и выбрать направление, мы сделали подборку наших бесплатных образовательных материалов, курсов и инициатив за 2015–2016 годы.
Читать дальше →
Total votes 48: ↑43 and ↓5 +38
Comments 29

Алан Кей рекомендует почитать старые и забытые, но важные книги по программированию

Reading time 2 min
Views 41K
image

Алан Кей — это магистр Йода для ИТишников. Он стоял у истоков создания первого персонального компьютера (Xerox Alto), языка SmallTalk и концепции «объектно-ориентированного программирования». Он уже много высказывался о своем взгляде на образование в сфере Computer Science и советовал книги тем, кто хочет углубить свои познания:


Недавно на Quora опять подняли эту тему и обсуждение вышло на первое место на Hacker News. Предлагаю вашему вниманию «новый» список суперстарых и фундаментальных книг по программированию и мышлению программиста от Алана Кея.

Lisp 1.5 Programmers Manual

by John McCarthy, 1962

image

Книга — абсолютный чемпион и пожизненный лидер рейтинга всех списков книг от Алана Кея. Этой версии языка уже нет, но книга — великолепна.

ещё восемь раритетов:
Читать дальше →
Total votes 37: ↑35 and ↓2 +33
Comments 74

В этой статье слишком много воды

Reading time 9 min
Views 40K
«Мы начинаем разработку новой игры, и нам нужна классная вода. Такую сможешь?»


, — cпросили меня. «Да не вопрос! Конечно, смогу», — ответил я, но голос предательски задрожал. «А, еще и на Unity?», — и мне стало понятно, что впереди очень много работы.
Читать дальше →
Total votes 175: ↑174 and ↓1 +173
Comments 36

[в закладки] PDF-версия руководства по Node.js и новое руководство по JavaScript

Reading time 2 min
Views 43K
Недавно мы опубликовали серию материалов, представляющую собой перевод руководства по Node.js. В первой публикации мы интересовались мнением аудитории о целесообразности перевода этого руководства и говорили, что планируется подготовить его PDF-версию.

image


PDF-версия документа состоит более чем из 120 страниц, содержит оглавление, немного картинок и всё необходимое форматирование. Просто закидывайте файлик в читалку и готово. Или в папочку с литературой. Или… решать вам.

Скачать PDF-версию [ 1.8 Мб ]



Сегодня мы хотим представить вашему вниманию новое руководство того же автора, посвящённое JavaScript.

Вот краткий перечень вопросов, которые оно раскрывает:
  • Общая характеристика языка и его стандартизация
  • Особенности стандартов ES6, ES7, ES8, ES9
  • Оформление кода, руководства по стилю
  • Лексическая структура языка
  • Переменные
  • Типы данных
  • Выражения
  • Логические выражения
  • Прототипное наследование
  • Классы
  • Исключения
  • Функции и замыкания
  • Массивы
  • Циклы
  • События
  • Асинхронное программирование
  • Таймеры
  • Строгий режим
  • Математические вычисления
  • Модули

Мы планируем это руководство перевести, но, прежде чем приняться за работу, хотели бы предложить вам поучаствовать в небольшом опросе
Читать дальше →
Total votes 37: ↑34 and ↓3 +31
Comments 11

Что представляет собой веб-приложение в продакшне?

Reading time 8 min
Views 16K
На заре карьеры я работал в компании, которая выпускала систему управления контентом. Эта CMS помогала отделам маркетинга самостоятельно управлять сайтами, а не полагаться на разработчиков при каждом изменении. Система помогла клиентам сократить операционные расходы, а мне — научиться создавать веб-приложения.

Хотя сам продукт имел очень общее назначение, клиенты обычно использовали его для конкретных задач. Эти задачи выжимали максимум из CMS, а разработчикам приходилось искать решение проблем. После десяти лет работы в таком окружении я узнал огромное число способов, как может сломаться веб-приложение в продакшне. Некоторые из них обсудим в этой статье.

Один из уроков, усвоенных за эти годы — отдельные инженеры обычно очень глубоко погружаются в интересующую их область, а всё остальное изучают до опасного поверхностно. Схема нормально работает в команде инженеров с хорошей коммуникацией, где знания перекрываются и заполняют отдельные пробелы у каждого из них. Но в командах с небольшим опытом или у отдельных инженеров происходит сбой.

Если вы начали работу в таком окружении, а затем приступили к созданию и развёртыванию веб-приложения с нуля, то очень быстро узнаете, что такое «до опасного поверхностные знания».
Читать дальше →
Total votes 35: ↑31 and ↓4 +27
Comments 5

Основы Redux (текстовый учебник, 2-е издание)

Reading time 2 min
Views 18K

Прошло 2.5 года после публикации первой версии подробного туториала по основам Redux. За это время gitbook насчитал 200 000+ уникальных посетителей.


redux cover


Под катом подробнее об учебнике и список изменений.

Читать дальше →
Total votes 26: ↑23 and ↓3 +20
Comments 8

TypeScript 3.0

Reading time 20 min
Views 45K
TypeScript 3.0! Да, он вышел, и в нем по-настоящему много нововведений. Под катом вы найдете подробное описание всех новинок последней версии, среди которых режим build, новый тип unknown, значительные изменения в API, улучшения производительности и многое другое. Присоединяйтесь!

Читать дальше →
Total votes 45: ↑43 and ↓2 +41
Comments 35

Как Яндекс готовит фронтендеров. От программы на Coursera до курсов в университете

Reading time 4 min
Views 17K
Мы в Яндексе не только много работаем с фронтендом, но и делимся своим опытом с другими. За шесть лет преподавательской практики мы запустили разные форматы обучения, о которых сегодня расскажем читателям Хабра.

Надеемся, эти материалы помогут как начинающим разработчикам, так и тем, кто хочет почерпнуть дополнительные знания, основанные на практике.



Читать дальше →
Total votes 15: ↑15 and ↓0 +15
Comments 11

Как я не уехал в США и стал Президентом в России

Reading time 13 min
Views 58K
В этом лонгриде я рассказываю как от безработного дорасти до президента. Запаситесь терпением и чувством юмора!



Как я стал безработным


В 2007-м мои рабочие будни проходили в большом “курятнике” в центре Москвы. В роли курочек выступали менеджеры, высиживающие свои проекты, на отведенной каждому площади в полтора квадратных метра на территории общего оупен-спейса. Контора носила очень гордое название, что-то в стиле Super Mega World Media Ventures. Ой, да именно такое и носила, только без Super Mega.

Бизнес-идея мирового венчура заключалась в том, чтобы “понабрать по объявлению” как можно больше менеджеров со всяческими идеями и пусть они стартапят свои проекты кто во что горазд. Авось парочка из них станет новыми фейсбуками — теория больших чисел в действии.
Читать дальше →
Total votes 124: ↑91 and ↓33 +58
Comments 422
1

Information

Rating
Does not participate
Location
Россия
Works in
Date of birth
Registered
Activity