Pull to refresh
34
0
Дмитрий Переверза @dpereverza

Ведущий Frontend-разработчик в компании Just-AI

Send message

[Пятничное] Теория Жоп

Reading time5 min
Views229K

Эту полу-шуточную теорию о проектном управлении я излагал коллегам по ИТ цеху лет 15 назад, и тогда же неоднократно слышал советы загрузить этот текст на Хабр, но руки не дошли. На днях, разгребая старые файлы наткнулся на свои записи и решил все таки поделиться ими с Вами. Частое употребление ключевого слова к сожалению, неизбежно и не отделимо для целостности этого текста, прошу принимать или нет 'as is'. Итак...

Каждая карьера развивается от Жопы к Жопе, и никак иначе. Хочешь повышения - ищи Жопу и принимай, как говорят в Америке, "challenge". Если Вам предлагают возглавить новый проект, либо занять какую то должность, да что угодно - знайте, там Вас ждет Жопа. Иначе не предложили бы, а сами бы справились. Равно как и если Вы ожидаете избавиться от надоевшей Вам сейчас деятельности, надеясь вырваться из "этого ада" и заняться "чем то новеньким" - будьте готовы встретиться с Большой Жопой.

Читать далее
Total votes 399: ↑388 and ↓11+473
Comments107

Насколько быстр Javascript? Симулируем 20 миллионов частиц

Level of difficultyEasy
Reading time23 min
Views22K

Я бросил себе вызов: симулировать 1000000 (миллион) частиц на чистом Javascript на телефоне, используя только CPU и добившись 60 FPS.

Поехали.

Задача не особо сложна, если выполнять всю работу на GPU, но правило гласит, что нужно пользоваться только CPU, при этом работая на JS, так что никакого WASM.

Читать далее
Total votes 109: ↑108 and ↓1+133
Comments34

Архитектура и реактивное программирование

Level of difficultyMedium
Reading time9 min
Views28K
reactivity as a pattern for low models coupling

Что такое реактивное программирование? Не Rx. И даже не Excel. Это архитектурный паттерн, позволяющий абсолютно иначе писать код. В статье мы устаканим фундаментальные знания, утвердимся в том, что React.js всё же является реактивным, и подумаем о том, как и когда нужно, а когда не нужно применять паттерны реактивного программирования.
Читать дальше →
Total votes 32: ↑31 and ↓1+46
Comments46

Различия между MVVM и остальными MV*-паттернами

Reading time11 min
Views160K


От переводчика:
Уже опубликовано много материалов по MVC и его производным паттернам, но каждый понимает их по-своему. На этой почве возникают разногласия и холивары. Даже опытные разработчики спорят о том, в чем отличие между MVP, MVVM и Presentation Model и что должен делать тот или иной компонент в каждом паттерне. Ситуация усугубляется еще и тем, что многие не знают истинную роль контроллера в классическом варианте MVC. Предлагаю вашему вниманию перевод хорошей обзорной статьи, которая многое проясняет и расставляет всё по своим местам.
Разобраться в MV-паттернах
Total votes 38: ↑37 and ↓1+36
Comments29

Пора переходить на микрофронтенд? Опыт «Инферит Клаудмастер»

Level of difficultyEasy
Reading time6 min
Views5.6K

Приветствую всех новичков и гуру фронтенда, а также всех, кто работает с интерфейсами. Я Никита Борцов, создаю красоту на фронте первой в России FinOps-платформы для управления облачными затратами “Инферит Клаудмастер”.

В этой статье вы узнаете о:

факторах, сформировавших тренд на уход фронтенд-разработки от монолита к микрофронтенду,
процессах со стороны команды разработки при переходе на микрофронтенд,
кейсе платформы “Инферит Кладумастер”: почему для нашей команды микрофронтенд с плагином Module Federation стал полезным решением,
признаках того, что пора переходить на микрофронтенд.

Читать далее
Total votes 12: ↑10 and ↓2+9
Comments2

Настоящее предназначение OpenAI SORA: как и зачем симулировать «Матрицу» для ChatGPT

Level of difficultyMedium
Reading time41 min
Views102K

Ну что, уже успели прочитать восхищения небывалым качеством видео от нейросетки SORA у всех блогеров и новостных изданий? А теперь мы вам расскажем то, о чем не написал никто: чего на самом деле пытается добиться OpenAI с помощью этой модели, как связана генерация видео с самоездящими машинами и AGI, а также при чем здесь культовая «Матрица».

Войти в симуляцию →
Total votes 248: ↑244 and ↓4+281
Comments122

Пишем сложный Page object для playwright тестов вместе с Dorama

Level of difficultyMedium
Reading time6 min
Views4.6K

Всем привет! Сегодня расскажу о том, как удобно организовать Page Object для большого проекта с использованием Playwright и библиотеки Dorama. Большинство современных веб-проектов имеют сложный интерфейс с переиспользуемыми компонентами. Причем компоненты могут переиспользоваться как на разных страницах, так и в рамках одной страницы. Поэтому важно грамотно оформить POM с самого начала, чтобы можно было добраться до любого локатора любого компонента на странице. Это упростит написание тестов и улучшит читаемость кода. При формировании страниц и компонентов мы будем использовать как наследование, так и композицию. Перейдем к делу.

Читать далее
Total votes 6: ↑5 and ↓1+5
Comments4

Webpack vs esbuild — уже можно использовать в production?

Level of difficultyMedium
Reading time12 min
Views13K

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

Читать далее
Total votes 24: ↑24 and ↓0+24
Comments26

Умные программисты пишут STUPID-код

Level of difficultyEasy
Reading time9 min
Views53K
Умные программисты пишут STUPID-код, ведь они понимают, что неожиданно возникшая сложность может привести к провалу проекта.


▍ Страдание


На момент написания этой статьи на моих часах 21:30.

Этим утром я проснулся в хорошем, оптимистичном настроении, рассчитывая на прекрасный день, но теперь вымотан.

Я вымотан не физически, а, скорее, разочарован тем, что, несмотря на все имеющиеся у нас замечательные технологии, позволяющие писать наилучшее ПО, мы, как люди, профессионально пишущие код, по множеству причин склонны ценить больше сложность, а не простоту.
Читать дальше →
Total votes 62: ↑58 and ↓4+73
Comments77

React Fiber & Concurrency Part 2 (2)

Level of difficultyEasy
Reading time8 min
Views4.9K

Данная статья посвящена реализации не блокирующего рендеринга - Concurrent React. Мы рассмотрим то, как работают под капотом Concurrent Features добавленные в 18 версии React. На основе теоретических знаний разберем результат профилирования тренировочного приложения и наглядно увидим, как Concurrent Features разбивают рендеринг приложения.

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

Читать далее
Total votes 3: ↑3 and ↓0+3
Comments0

Увеличиваем свою производительность в WebStorm / PhpStorm c помощью шаблонов

Level of difficultyEasy
Reading time3 min
Views7.2K

В статье рассмотрим как создавать шаблоны в продуктах Jesbrains (WebStorm, PhpStorm, Intellij, PyCharm).

Читать далее
Total votes 11: ↑11 and ↓0+11
Comments11

Подружим Sentry и Mattermost быстро и просто через адаптер

Level of difficultyEasy
Reading time4 min
Views2.9K

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

Вот 4 простеньких шага для решения этой проблемы...

Читать далее
Total votes 1: ↑1 and ↓0+1
Comments3

Линейный код более читаем

Level of difficultyMedium
Reading time3 min
Views19K

Бунтарём себя можно считать только тогда, когда люди на самом деле защищают противоположную вашей позицию. Я не согласен с одной из best practices, недавно представленной в Google Testing Blog . Обычно это очень хороший ресурс, ведь этот пост не случайно попал в мою читалку новостей!

Авторы представили две версии функции и спросили, какая из них более читаема.

Читать далее
Total votes 38: ↑32 and ↓6+39
Comments181

Подробная настройка Content Security Policy (CSP)

Level of difficultyMedium
Reading time10 min
Views27K

Content Security Policy (CSP) - это механизм безопасности веб-приложений, который используется для сокращения рисков, связанных с атаками, такими как внедрение скриптов (XSS) и выполнение нежелательного кода (инъекция). CSP позволяет веб-разработчикам указывать браузерам, из каких источников разрешено загружать ресурсы, такие как скрипты, стили, изображения, шрифты и другие элементы.

Читать далее
Total votes 3: ↑3 and ↓0+3
Comments4

Как работает JS: WebRTC и механизмы P2P-коммуникаций

Reading time14 min
Views42K
[Советуем почитать] Другие 19 частей цикла
Часть 1: Обзор движка, механизмов времени выполнения, стека вызовов
Часть 2: О внутреннем устройстве V8 и оптимизации кода
Часть 3: Управление памятью, четыре вида утечек памяти и борьба с ними
Часть 4: Цикл событий, асинхронность и пять способов улучшения кода с помощью async / await
Часть 5: WebSocket и HTTP/2+SSE. Что выбрать?
Часть 6: Особенности и сфера применения WebAssembly
Часть 7: Веб-воркеры и пять сценариев их использования
Часть 8: Сервис-воркеры
Часть 9: Веб push-уведомления
Часть 10: Отслеживание изменений в DOM с помощью MutationObserver
Часть 11: Движки рендеринга веб-страниц и советы по оптимизации их производительности
Часть 12: Сетевая подсистема браузеров, оптимизация её производительности и безопасности
Часть 12: Сетевая подсистема браузеров, оптимизация её производительности и безопасности
Часть 13: Анимация средствами CSS и JavaScript
Часть 14: Как работает JS: абстрактные синтаксические деревья, парсинг и его оптимизация
Часть 15: Как работает JS: классы и наследование, транспиляция в Babel и TypeScript
Часть 16: Как работает JS: системы хранения данных
Часть 17: Как работает JS: технология Shadow DOM и веб-компоненты
Часть 18: Как работает JS: WebRTC и механизмы P2P-коммуникаций
Часть 19: Как работает JS: пользовательские элементы

Сегодня мы публикуем перевод 18 части серии материалов, посвящённых всему, что связано с JavaScript. Здесь мы поговорим о технологии WebRTC, которая направлена на организацию прямого обмена данными между браузерными приложениями в реальном времени.

image
Читать дальше →
Total votes 33: ↑33 and ↓0+33
Comments5

Парсеры, обработка текста. Просто о сложном. CFG, BNF, LL(k), LR(k), PEG и другие страшные слова

Reading time19 min
Views47K
Наверное, каждому программисту приходилось сталкиваться с задачами вида «прочитать что-то в формате А и произвести с ним некие манипуляции». Будь то json, логи nginx, cfg, sql, yaml, csv или что-то еще. Хорошо, когда можно воспользоваться библиотекой, однако, по разным причинам, это удается не всегда. Тогда и встает вопрос создания собственного парсера для заданного формата. И это, как говорят англичане, часто оказывается PITA (болью в ...). В этой статье я постараюсь облегчить эту боль. Кому интересно, добро пожаловать.
Читать дальше →
Total votes 43: ↑42 and ↓1+41
Comments24

Как реализовать язык программирования на JavaScript. Часть 1: Парсер

Reading time18 min
Views17K

Здравствуйте! Представляю вам любительский перевод руководства реализации своего языка программирования на JavaScript — PL Tutorial.


От переводчика


Мы создадим свой язык программирования — λзык (в оригинале — λanguage). В процессе создания мы будем использовать достаточно много интересных техник, таких как рекурсивный спуск, стиль передачи управления, базовые техники оптимизации. Будет создано две версии интерпретатора — обычный и CPS-интерпретатор, транс-компилятор в JavaScript.


Автор оригинала — Mihai Bazon, автор известной библиотеки UglifyJS (инструмент для минимизации и форматирования JS-кода).

Читать дальше →
Total votes 30: ↑28 and ↓2+26
Comments24

3D своими руками. Часть 1: пиксели и линии

Reading time13 min
Views27K


Этот цикл статей я хочу посвятить читателям, желающим изучить мир 3D-программирования с нуля, людям, которые хотят узнать основы создания 3D-составляющей игр и приложений. Каждую операцию мы будем реализовывать с чистого листа, чтобы понимать каждый аспект, даже если есть уже готовая функция, которая делает это быстрее. Научившись, мы будем переходить на встроенные инструменты по работе с 3D. По прочтению цикла статей вы поймете как создаются сложные трехмерные сцены со светом, тенями, текстурами и эффектами, как все это сделать без глубоких познаний в математике и многое другое. Сможете все это делать как самостоятельно, так и при помощи готовых инструментов.
Начать обучение
Total votes 29: ↑27 and ↓2+36
Comments11

Знакомство с профилировщиком производительности вашего браузера

Reading time5 min
Views6.2K

В какой-то момент своей карьеры вы, возможно, просматривали вкладку «Производительность» в инструментах разработки вашего любимого браузера. В конце концов вы попытались создать profile, но, вероятно, быстро разочаровались. Высокая плотность отображаемой информации делает ее немного подавляющей и несколько пугающей. Я был там, я понимаю тебя!

Хорошая новость: кривая обучения на самом деле не такая крутая!
Как только вы усвоите несколько концепций, он внезапно станет вашим самым ценным инструментом для устранения узких мест в производительности.

Эта статья даст вам несколько ключей к пониманию того, как работает профайлер и как правильно его использовать.
Давайте полностью забудем о console.log и console.time, сегодня мы погрузимся в профилировщик производительности!

Читать далее
Total votes 6: ↑5 and ↓1+4
Comments0

Как мы обучили нейросеть поздравлять женщин с 8 марта

Reading time6 min
Views5.4K

В честь 8 марта мы запустили сервис поздравлений, в основе которого нейросеть. Любой желающий может воспользоваться им, чтобы сгенерировать уникальное изображение цветка и текст поздравления.

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

Читать далее
Total votes 10: ↑4 and ↓6+2
Comments11

Information

Rating
Does not participate
Location
Ростов-на-Дону, Ростовская обл., Россия
Date of birth
Registered
Activity

Specialization

Frontend Developer
Lead