Всем привет! Меня зовут Ростислав и я занимаюсь разработкой мониторинга для сайтов. Это мой пет-проект, если можно его так назвать. Иногда мониторинг сталкивается с проблемой, когда нужно проверить принадлежность сайта конкретному пользователю. Как это делается, я расскажу в статье.

Примеры кода будут на Python (FastAPI, SQLAlchemy, mypy) и Java (Spring, Hibernate). Изначально проект был написан на Python, но по мере роста был переписан на Java для упрощения поддержки и развития. 

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

Под катом: формат данных, способы отправки, типы метрик и их применение, кардинальность.

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

Мне нужен был гайд, который сочетает эти две вещи: сначала «почему так принято», а затем — «как правильно делать». В результате такой гайд мне пришлось написать самому. Его цель — объяснить разработчикам с любым бэкграундом, что такое метрики, как правильно о них думать и осмысленно использовать. Сначала гайд жил во внутренней документации Точки, но я решил сделать его публичным — возможно, кому-то этот опыт будет полезен. Разбираться будем с Prometheus и Grafana. Если у вас другой стек — не страшно. Мы затронем и фундаментальные темы: например, перцентили, производные и кардинальность.

Гайд будет выходить как цикл статей. Сначала посмотрим на архитектуру: как собираются метрики и где хранятся. Дальше разберемся с типами метрик — они не так просты, как кажется. Потом придется немного отвлечься на математику (но только с инженерной точки зрения!). И, наконец, научимся писать запросы, но не просто так: сразу посмотрим на разные грабли и неочевидные моменты.

display: flex;
justify-content: center; /* Горизонтальное центрирование */
align-items: center; /* Вертикальное центрирование */

display: grid;
justify-items: center; /* Горизонтальное центрирование */
align-items: center; /* Вертикальное центрирование */

В последнее время фронтенд все больше и больше обрастает новыми технологиями, одна из них — WebAssembly. На ней можно написать полноценное web‑приложение и почти все на что способна ваша фантазия. В статье мы рассмотрим, что такое WebAssembly, как работает и с чем её едят. И конечно же я хотел поделиться рецептом приложения. Возьмем наш любимый React и добавим Yew, приправим всё это webpack-ом и добавим щепоточку module‑federation. Статья будет интересна всем, кто хочет познакомиться с WebAssembly и добавить разнообразия в список используемых фреймворков и библиотек для написания пользовательских компонентов.

Редакс - Single-store стейт-менеджер, в котором к тому же принято группировать данные по объектам. Примерно так же, как в стейте классовых компонентов в реакте.

То есть, это совершенная противоположность атомарного подхода, которому, к примеру, следуют многие хуки реакта или Multi-store стейт-менеджеры (например Effector, где селекторы не нужны по определению - достаточно сторов).

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

В общем, раз в редаксе нет возможностей ни эффектора, ни MobX, нам лишь остается напрямую обращаться к данным, начиная с самого верха. Это превращается в нечто вроде state.foo.bar.baz. А если перед этим еще нужно произвести какие-то вычисления с участием других значений из стора?

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

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

За то время что я занимаюсь менторством я заметил, что большинство вопросов новичков связаны с темами: конкурентность, параллелизм, асинхронность. Подобные вопросы часто задают на собеседованиях, в работе эти знания позволяют писать более эффективные и производительные системы.

Цель статьи - понятно и доходчиво, используя примеры кода и бенчмарки рассказать о том какие инструменты есть в Python и как с их помощью добиться высокой производительности.

Есть много библиотек и фреймворков, которые помогают преодолеть все препятствия на пути JavaScript разработчика. Если раньше мы использовали ванильный JS, то со временем пришёл jQuery, а затем React и Vue. Каждый год появляется все больше новых библиотек, фреймворков и инструментов. Некоторые из них продолжают развиваться и находят свою аудиторию, в то время как другие исчезают и постепенно забываются. В статье рассмотрим ещё одну библиотеку, которая может быть полезной для разработки небольших и простых пользовательских интерфейсов.

Когда вы только начинаете изучать веб-разработку, перед вами не стоит проблема сборщиков кода, но как только ваши приложения начинают разрастаться и разделяться на модули, встает вопрос о сборке кода. Любой разработчик знаком с Webpack, потому что на данный момент это номер один инструмент по популярности для сборки проектов, а с Rollup знакомы далеко не все.

TL;DR

Context и Redux — это одно и тоже?

Является ли контекст инструментом «управления состоянием»?

Являются ли Context и useReducer() заменой Redux?

Когда следует использовать контекст?

Когда следует использовать Context и useReducer()?

Когда следует использовать Redux?

• Большое количество компонентов с состояниями, в которых используются одни и те же данные
• Состояние приложение часто обновляется
• Сложная логика обновления состояния
• Приложение имеет среднюю или большую кодовую базу и над ним работает много людей
• Вы хотите знать когда, почему и как обновляется состояние приложения и иметь возможность визуализировать эти изменения
• Вам требуются более мощные возможности по управлению побочными эффектами, стабильностью (постоянством) и сериализацией данных

Фронтенд-разработчики каждый день используют модули. Это может быть функция из локального файла или сторонняя библиотека из node_modules. Сегодня я кратко расскажу об основных модульных системах в JavaScript и некоторых нюансах их использования.

Привет! Меня зовут Андрей Якобчук, я ведущий фронтенд-разработчик в Muse Group. Мы постоянно работаем над ускорением клиентской части наших сайтов. К тому же Гугл с его метриками Core Web Vitals с каждым годом придаёт всё большее значение отзывчивости и стабильности интерфейса сайтов и понижает в ранжировании те, которые считает неудобными для пользователя. В статье я расскажу о том, какие подходы мы используем для измерения и мониторинга перфоманса сайтов, а также дам рекомендации, как можно улучшить ваш проект. 

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

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

Решил я тут с одного старого сайта ( не на WooCommerce ) перенести товары на новый сайт с WooCommerce. Набросал по-быстрому скрипт экспорта custom’ных постов в съедобный для WooCommerce CSV-формат и при первой попытке импорта тут же получил:

Переделываем тут один старый WordPress-сайт в новый Интернет-магазин на WooCommerce. На старом сайте много товаров в виде custom’ных постов с заказом через простую форму Contact Form 7. А надо сделать всё красиво с WooCommerce. Писать граббер прямо с сайта нет желания, импортировать прямо из БД тоже возня лишняя, решили собрать все товары со старого сайта в формате CSV, чтобы потом его загрузить в родной импорт товаров WooCommerce.