JavaScript *

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

Иногда возникает необходимость разделить длительную дорогую (с точки зрения вычислений) задачу на несколько тиков (ticks) цикла событий (event loop). Существует множество способов это сделать. Рассмотрим их.

Легко "уничтожить" пользовательский опыт, позволив длительной дорогой задаче захватить основной поток (main thread). Неважно, насколько сложным является приложение, цикл событий может выполнять только одну задачу за раз. Пока выполняется одна задача, другие ждут своей очереди. Как правило, задача выполняется настолько быстро, что пользователь ничего не замечает. Но так бывает не всегда.

Каждый PHP-разработчик, работая с современными JavaScript-фреймворками, наверняка задумывался о том, как было бы здорово передавать данные напрямую в компоненты без танцев вокруг контроллеров и типов данных. Арон Френсис, видимо, тоже терзал себя этим вопросом, поэтому 4 февраля 2025 года на своём ютуб-канале представил новую веху развития фронтенда на Laravel — Fusion.  В этом статье мы рассмотрим базовые принципы работы библиотеки и основные нюансы работы с ней.

Что вы делаете с незакрытыми вкладками браузера? На мой взгляд, они занимают слишком много места на экране, поэтому на этой неделе я разобрался, как запустить в этих вкладках Pong.

Это 240 вкладок браузера в плотной сетке 8x30. И в них запущен Pong! Видно, что мяч и ракетки перемещаются по canvas в окне и во всех вкладках.

Код (ужасный) можно посмотреть на GitHub. Но как он работает?

Хотите освоить WebSocket и создать собственный чат с комнатами? В этой статье мы разберем:

• В чем разница между WebSocket и классическим HTTP

• Как реализовать сервер на FastAPI с поддержкой WebSocket

• Как создать простой FullStack-чат для мгновенного обмена сообщениями

• Как всего за пару минут развернуть готовое приложение на облачном сервисе

Статья написана с учетом новичков, но и опытные разработчики найдут здесь полезные инсайты.

Рассказать надёжный способ заработать на криптовалютах? Устраиваетесь в блокчейн-проект разработчиком, пишете код, получаете зарплату. Готово, вы стали богаче, пока другие прогорали на бирже!

Шутки шутками, но мир web3 разросся в индустрию со своими вакансиями. И в ней востребован JavaScript, причём не только на фронтенде. Так что у JS-разработчиков появился смысл обращать внимание на этот сегмент, а на нашей конференции HolyJS появились доклады об этом.

И для Хабра мы решили перевести в текстовый вид выступление Александра Казакова @AlexandrKazakov, помогающее влиться в тему. В этом докладе рассматривается блокчейн Solana, но после него проще будет разбираться и с другими вроде Ethereum или TON. Если вам удобнее видео, прилагаем ссылки: YouTube, VK Видео. Далее — текст от лица спикера.

Привет, Хабр! Я – Рома, front-end разработчик в компании «АйТи-Баланс». Мне не понаслышке известно, насколько ресурсозатраным (в плане времени и сил) может быть поиск и исправление ошибок в JS. Новичкам этот процесс может показаться неподъёмным камнем, но только до знакомства с отладкой в инструментах разработчика, встроенных в браузер. О ней я и расскажу, причём затрону не console.log, а куда более эффективную альтернативу.

На тему мемоизации написано довольно много статей, и все они хорошо раскрывают суть. Но мне часто не хватало шпаргалки, которую можно отправить на вопрос «А как мемоизировать?». В статье речь пойдет исключительно о функциональных компонентах.

В этой статье я расскажу о настройках TypeScript, определяемых в файле tsconfig.json, которых я использую в своих проектах.

❯ 1. Возможности, не затрагиваемые в этой статье

В этой статье описывается в основном настройка проектов, в которых все локальные модули являются ESM. Мы почти не будем говорить об импорте CommonJS.

Также мы не будем говорить о следующем:

• импорт и проверка типов обычного JavaScript — настройках allowJs и checkJs
• настройка JSX. См. раздел "JSX" карманной книги по TS
• "проекты" (полезно для монорепозиториев): настройка composite и др. См.:
  
  • раздел "Ссылки на проекты" карманной книги по TS
  • статья "Создание простых монорепозиториев с помощью пространств имен (namespaces) npm и ссылок на проекты TS"

Привет! На связи Кристина, фронтенд-разработчик в отделе рекламных спецпроектов KTS.

Наша команда создает визуально эффектные проекты, цель которых — привлечь внимание пользователей. Мы постоянно экспериментируем с разными технологиями и подходами, и вот, наконец, добрались до 3D-анимаций. Недавно я начала изучать Three.js и хочу поделиться своим опытом.

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

Для успешного прохождения туториала достаточно владеть JavaScript и ООП. Каждый этап сопровождается ссылкой на codepen с комментариями в коде. А в конце вас ждет играбельный codepen-блок: вы можете сразу посмотреть на промежуточный результат, в котором уже реализована базовая игровая механика. В статье же я пошагово разберу, как к этому результату прийти.

Современный React все больше соответствует идеалам функционального программирования.

Ежедневно мы пользуемся подходами из мира ФП, зачастую даже не подозревая об этом.

Эти паттерны плотно укоренились в сознании фронтенд-разработчиков, делая наш код значительно чище, читаемее и предсказуемее.

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

Привет, друзья!

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

Сегодня мы поговорим об алгоритмах сортировки.

Код, представленный в этой и других статьях серии, можно найти в этом репозитории.

Интересно? Тогда прошу под кат.

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

Подробная инструкция по разработке трёхфазного энергомонитора на базе ESP8266 с функцией автоматической проверки прибора учёта электроэнергии.

Многие, конечно, знают, что в Angular-сообществе принято трепетно следить за подписками на Observable, потому что это чревато утечками памяти. Но не все видели эти утечки в глаза и не встречались с их последствиями. Давайте смоделируем простую ситуацию по следам утечки, с которой недавно столкнулся я (первый раз).

Как всего одна небольшая React-задача помогает глубже понять уровень кандидата на собеседовании? Разбираем нюансы работы с хуками, асинхронностью, состоянием гонки и сайд-эффектами. На первый взгляд задача кажется простой - всего лишь компонент, загружающий данные по username. Но в процессе решения выявляются ключевые моменты: правильно ли кандидат управляет состоянием, учитывает ли смену пропсов, обрабатывает ошибки и предотвращает race conditions. Этот вопрос помогает не просто проверить знания, а увидеть, как кандидат рассуждает и принимает технические решения.

Тестирование на скорость рисования 2D графиков и измерение fps популярных графических пакетов (Mayavi 3D, PyVista, Matplotlib, PyQTGraph, Plotly, PyGame, Arcade, pyOpenGL, VisPy, Bokeh) Возможно ли на слабом железе получить FPS=50? А FPS=1000? Да, но есть нюансы: VSync=Off

Для 8 графических пакетов в статье приведены 8 максимально коротких и простых специфичных для каждого пакета кода на python, отображающий на экране с максимально возможным FPS для данного пакета график sin()+noise.