Обновить
256K+

JavaScript *

Прототипно-ориентированный язык программирования

271,67
Рейтинг
Сначала показывать
Порог рейтинга

🤔 Как не терять requestId в логах не пробрасывая его через параметры методов?

Классическая проблема NodeJS разработки: логи не читаемы. При дебаге когда пользователь один, разобрать что происходит ещё можно. Но после запуска в прод в логах сборная солянка из запросов и восстановить трейс вызова композиции методов нельзя

import { scoped } from "di-scoped";

export interface IRequestContext {
  userId: string;
  requestId: string;
  serviceName: "mobile" | "desktop";
  version: number;
}

export const RequestContextService = scoped(
  class {
    constructor(readonly context: IRequestContext) {}
  }
);

export type TRequestContextService = InstanceType<
  typeof RequestContextService
>;

export default RequestContextService;

Согласно MVC, делается два слоя: View и Controller. На уровне view кладем requestId в контекст исполнения через RequestContextService.runInContext

import { inject } from "di-kit";

export class SocketViewService {
  readonly loggerService = inject<LoggerService>(TYPES.loggerService);
  readonly socketControllerService = inject<SocketControllerService>(TYPES.socketControllerService);

  public sendNewOrder = async (
    request: TRequest<{ room: string; orderId: string }>,
  ): Promise<TResponse<SendNewOrder>> => {
    this.loggerService.log("socketViewService sendNewOrder", { request });
    try {
      const data = await RequestContextService.runInContext(
//                 ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
        async () =>
          await this.socketControllerService.sendNewOrder(request.data),
        request,
      );
      return { status: "ok", serviceName: request.serviceName, version: request.version, userId: request.userId, requestId: request.requestId, data };
    } catch (error: any) {
      this.loggerService.log("socketViewService sendNewOrder error", { request, error: errorData(error) });
      return { status: "error", error: VerificationError.getErrorMessage(error), errorCode: VerificationError.getErrorCode(error), serviceName: request.serviceName, version: request.version, userId: request.userId, requestId: request.requestId };
    }
  };
}

Voila! Во всех вложенных сервисах к записи в лог будет приложен идентификатор requestId. Дополнительно, этот код позволяет сериализовать ошибки так, чтобы передавать их по шине gRPC

import { inject } from "di-kit";
import { createLogger } from 'pinolog';

const logger = createLogger("socket.log");

export class LoggerService {

  readonly requestContextService = inject<TRequestContextService>(TYPES.requestContextService);

  private get context() {
    if (RequestContextService.hasContext()) {
      // в лог - только конверт IRequestContext; scoped-контекст. но дебаггеру виден весь запрос
      const { serviceName, version, userId, requestId } = this.contextService.context;
      return { serviceName, version, userId, requestId };
    }
    return {};
  }

  public log = (topic: string, ...args: any[]) => {
    logger.log(topic, ...args, this.context);
  }

}
Теги:
+4
Комментарии0

Представлен открытый проект Free Router, автоматически переключает ИИ‑агента между 25 бесплатными провайдерами для значительной экономии токенов, включая бесплатные. На выбор есть любые актуальные модели: DeepSeek, GLM-5.3, Qwen-3.8.

Теги:
+3
Комментарии0

🤡 Новый фреймворк на NodeJS

Это не draft, а работающий код из прода. Посмотрите код сервиса, код http контроллера и код декларации

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

import { provide, inject } from "di-kit";

export class WalkerLogicPublicService {

  private readonly loggerService = inject<LoggerService>("loggerService");

  ...

}

...

provide("loggerService", () => new LoggerService());

Вот почему нельзя просто вот так? Никаких минусов нет, выносите типы в enum, создавайте изолированные пространства имен.

import { createActivator } from "di-kit";

export const { init, inject, provide } = createActivator("separate-scope");
Теги:
+8
Комментарии0

Регуляторы скоро спросят «где у вас RSA?». Я написал сканер, который отвечает за секунды

  1. Завязка. Три дедлайна: США — PQC для новых госзакупок нацбезопасности с 2027 (EO 14412 / CNSA 2.0, там прямо назван CBOM), Великобритания — полная криптографическая инвентаризация и план миграции к 2028 (NCSC), ЕС — переход с конца 2026. Первый вопрос аудитора одинаковый: «где именно у вас используется RSA?» Ответа нет почти ни у кого.

  2. Что такое CBOM и почему это не то же самое, что SBOM.

  3. «Harvest now, decrypt later» — почему это не про далёкое будущее: трафик записывают сегодня, расшифруют потом. Если у секрета срок жизни больше нескольких лет — проблема уже наступила.

  4. Как работает сканер. Одна команда, три артефакта: CycloneDX 1.6 CBOM, отчёт с планом миграции на ML-KEM/ML-DSA, SARIF для GitHub code scanning. Плюс scan-tls — одно рукопожатие и вердикт по живому эндпоинту.

  5. Байка про баг (Хабр это любит): первый же регрессионный тест поймал, как сканер находит «криптографию» в собственных регулярках. Лечилось маскировкой литералов RSA_generate_ke[y], и теперь есть вечный тест, что репозиторий подсвечивает только свои фикстуры.

  6. Честный бенчмарк против PQCA CBOMkit. Не «мы лучше», а «мы разные»: CBOMkit глубже на Java/Python (знает размеры ключей, симметрику), мы шире (10+ языков, конфиги, сертификаты) и быстрее (0,05–0,12 с против минуты). Прямая ссылка на docs/BENCHMARK.md — воспроизводимо кнопкой в CI.

  7. Ограничения честно: v0 на паттернах, динамические вызовы пропустит, отсутствие находок ≠ отсутствие проблем. AST-движок в планах.

  8. Финал: вопрос к читателям — у кого уже спрашивали CBOM и в каком виде.

Теги:
+3
Комментарии0

Chrome изменил работу window.open с несколькими мониторами

Раньше в Chrome можно было открыть окно на втором мониторе обычным window.open, передав его координаты:

window.open(url, '_blank', 'left=1920,top=0');

Теперь Chrome может ограничить позицию окна текущим экраном, если сайту не выдано разрешение «Управление окнами» (window-management). При этом в Firefox старый вариант продолжает работать.

Современное решение — Window Management API:

const details = await window.getScreenDetails();

const screen = details.screens.find(
  x => x !== details.currentScreen
);

window.open(
  url,
  '_blank',
  `left=${screen.availLeft},top=${screen.availTop}`
);

Главный нюанс: вызов getScreenDetails() запрашивает разрешение на управление окнами. После его выдачи Chrome снова позволяет корректно размещать окно на другом мониторе.

P.S. это изменение уже упоминалось в версии 135.0.7049.116 - ссылка

Теги:
+5
Комментарии0

У коллег увидел интересный HTML трюк для значений в SELECT, который раньше не встречал.

Задача: сделать мульти-селект. Значения, которые влезут на текущем экране отображаем, а остальные указываем цифрой.

Первая мысль: нужно смотреть размеры элемента и родителя. Динамический высчитывать размеры и пытаться понять, влезет еще одно на экран или нет.

Решение коллег:

  • Выводим сразу штук 10 значений;

  • Каждому значению сразу пишем цифру, сколько элементов осталось после него;

  • Делаем всем отрицательный margin-left, чтобы они своим контейнером перекрыли цифру прошлого значения.

Никаких вычислений и перерасчетов при масштабировании и изменении размера экрана.

Теги:
+11
Комментарии1

Представлен открытый проект Phone Farm iOS - TikTok-ферма на устройствах с iOS. Подключаем iPhone к Mac, регистрируем в панели и управляем прямо из браузера: можно смотреть экран в реальном времени, тапать, свайпать и запускать автоматизацию TikTok. Встроенный планировщик публикует посты и слайд-шоу по расписанию, а очередь и история запусков хранятся в PostgreSQL. Проект работает без джейлбрейка и полностью локально.

Теги:
+1
Комментарии0

Анализаторы кода легко и быстро умеют находить множество ошибок, не очевидных с первого взгляда. Попробуйте посоревноваться с PVS-Studio в прозорливости!

Мы сделали новый квиз «Найдите ошибки в JS & TS коде»!

Вас ждут 10 фрагментов кода, в которых наш анализатор нашёл ошибки. Все они взяты из известных Open Source проектов. Ваша задача — успеть найти ошибку за 60 секунд (не переживайте, фрагменты небольшие).

Время посоревноваться с анализатором! А потом можно и его проверить 😉

Переходите по ссылке!

Теги:
+4
Комментарии6

Недавно мне понадобилось достать данные из QR-кода на кассовом чеке. Чек был в плохом состоянии: слегка затёрт + характерные полоски термопечати. Все обычные сканеры и приложения дружно отказывались его читать. Первая идея — открыть фото в редакторе и вручную перерисовать модули — очень быстро показала свою несостоятельность. Несколько сотен точек, глаза начинают плыть уже через 10–15 минут. Дальше начались размышления, как это можно сделать разумнее. Полностью отдавать задачу нейросети я не хотел. На грязных данных с полосками и неравномерной засветкой модель легко начинает «додумывать» модули. А мне нужна была не красивая картинка, а гарантированно читаемый код. Поэтому я решил пойти по гибридному пути: максимально автоматизировать рутину, а финальное решение в сомнительных местах оставить человеку. Что получилось в итоге Инструмент работает полностью в браузере. Фото никуда не отправляется. Основной сценарий (самый частый): Загружаешь фото. Обрезаешь, поворачиваешь, подкручиваешь экспозицию, контраст, гамму, резкость, шумоподавление и т.д. После любого изменения программа сразу пытается прочитать QR. Если код прочитался — сразу получаешь: чистый QR (можно сохранить); сами данные (можно скопировать). На этом можно остановиться. Дальше идти не нужно. Если автоматического чтения не произошло — включается более глубокий режим: Автоматический поиск области кода и определение размера модуля (через поиск finder-паттернов 1:1:3:1:1). Построение сетки. Коррекция перспективы и кривизны бумаги через сетку контрольных точек (кусочно-билинейная деформация). Построчная проверка модулей: программа предлагает цвет, человек только подтверждает или инвертирует. Ручная проверка каждого модуля — это крайний случай, когда даже после всех обработок фото код всё равно не читается. Технические детали Бинаризация через Otsu. Определение шага модуля по характерным сериям 1:1:3:1:1. Адаптивный порог цвета модуля относительно соседей 3×3. Живое декодирование на каждом этапе изменения изображения. Возможность вручную править геометрию через контрольные точки. Инструмент доступен здесь: https://zoommax.space/ Буду рад обратной связи, особенно по сложным случаям (сильные повреждения, сильный ракурс, очень грязная печать).

Теги:
+9
Комментарии4

Открытый проект ffmpeg webCLI (веб-версия) для работы с видео позволяет выполнять больше 20 различных манипуляций за один клик с любыми роликами: менять размер, вырезать аудио, сжимать, конвертировать в gif или другие форматы, ускорять, миксовать, стираем вотермарки, добавлять блюр, зацикливать.

Теги:
+6
Комментарии0

Micropatches | GitHub

Уже давно заметил, что если навигироваться в Obsidian через зажатие стрелок, то через какое-то время появляется жесточайший лаг.

Решил сделать профилирование. Получилось довольно продуктивно. По пути кинул баг-репорты Fakelink и Excalidraw, чтобы они улучшили производительность в конкретных местах. На удивление проблемы решились в тот же день. Видимо, мало кому из разработчиков нравится, когда их плагин тормозит :)

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

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

Сейчас в плагине есть следующие микропатчи:

  1. Исправляет лаг при зажатии стрелок

  2. Держит курсор примерно в центре для удобства чтения

  3. Скрывает светофор на macOS

  4. По умолчанию открывает поиск в Bases

  5. Убирает анимации в интерфейсе

Если у вас есть идеи, какие ещё можно сделать микропатчи, то буду рад их рассмотреть.

Теги:
Всего голосов 3: ↑3 и ↓0+5
Комментарии0

Представлен открытый проект WebKit CSSFontFace Exploit for PS4/PS5, который прошивает игровую консоль меньше чем за минуту. Работает через подмену кода в браузере: пока WebKit пытается считать CSS-код страницы, запускается эксплойт системы. Решение запускается на прошивках с версиями от 6.00 до 11.02 и совместимо с kernel-эксплойтом для версий 7.00–11.02, позволяя запускать HEN и другие пэйлоды. Минусы проекта: перепрошивку придётся активировать при каждом перезапуске консоли.

Теги:
Всего голосов 5: ↑5 и ↓0+7
Комментарии0

Превращаем свой почерк в устанавливаемый шрифт. Вышел открытый навык draw-your-font для Claude Code, который собирает полноценный TTF по фотографии. Достаточно написать алфавит на листе бумаги, сфотографировать его и загрузить снимок в Claude. Нейросеть сама распознает буквы, очистит изображение и соберет готовый шрифт. Если какая-то буква получилась неудачно, Claude заметит это и предложит переписать символ перед финальной сборкой.

Теги:
Всего голосов 3: ↑3 и ↓0+5
Комментарии0

Ближайшие события

Фронтенд для души, бэкенд для людей!

Мастер по разводу холивар
Мастер по разводу холивар

Были приняты меры погрузиться под воду дабы показать серьезность моих намерений в данной щепетильной теме.

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

Бэкенд наоборот поддерживает порядок и структурность. Меньше экспериментов и больше проверенных решений, самое то для "сделал работу - пошел спокойно домой".

Теги:
Всего голосов 5: ↑3 и ↓2+3
Комментарии2

Представлен открытый проект Send it, with PairDrop (веб-версия проекта) — AirDrop для всех. Это универсальный способ передачи файлов на ПК и мобильных устройствах в браузере между Windows, Linux, Android, iOS, macOS и другими ОС:

  • работает без скачиваний драйверов и утилит и дополнительного ПО;

  • просто открываем сайт на обоих устройствах в браузере и начинаем передачу;

  • если используете одну сеть Wi‑Fi — устройства сразу увидят друг друга;

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

  • передача файлов идем напрямую между устройствами;

  • можно передавать большие объёмы данных без ограничений.

Теги:
Всего голосов 4: ↑4 и ↓0+6
Комментарии0

Хай, коллеги!

Около полутора месяцев назад, работая над задачей дообучения локальной модели ИИ, я наткнулся на Modern Web Guidance - сборник руководств (skills - навыков) по современной веб-разработке для агентов ИИ от команды Google Chrome. Ознакомившись со сборником, я понял, что большинство руководств человекам тоже не помешали бы😄 Так появился этот репозиторий. Основная работа над руководствами завершена. Любые исправления, замечания и предложения приветствуются. Пользуйтесь на здоровье и счастливого кодинга!

Теги:
Всего голосов 4: ↑3 и ↓1+4
Комментарии1

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

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

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

Примерно так во многих местах работает найм
Примерно так во многих местах работает найм

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

Также сдаётся мне, что hh совершенно не подходит для поиска работы разработчиком.

В связи с этим хотел бы попросить совета у коллег по цеху, особенно фронтовиков, в форме трех следующих вопросов:
1. Где лучше искать работу, на каком ресурсе?
2. Замечаете ли вы, что hr часто набирают не тех кто реально способен, а тех кто умело врет или красиво улыбается?
3. Стоит ли искать работу фронту или стоит сменить профессию?

Теги:
Всего голосов 5: ↑5 и ↓0+8
Комментарии14

Привет. Я пишу бэкенд на Go, люблю строгую типизацию и предсказуемость. Но игнорировать тему ИИ-ассистентов глупо, поэтому я решил проверить, насколько они применимы для сборки нормального, защищенного проекта, а не просто кривых прототипов.

Чтобы эксперимент был чистым, взял стек, с которым не работаю каждый день: Node.js (Express 5) и Vanilla JS. На выходе получился хаб с утилитами: https://toolkitch.ru/

Главная идея проекта - простые инструменты средствами компьютера. Меня всегда раздражало, что популярные онлайн-сервисы гоняют данные на свои сервера, хотя по факту это может выполняться на компьютере. Здесь инструменты работают строго client-side, то есть в браузере пользователя. Ничего не устанавливал и не скачивал, но выполнил на компьютере.

По технической части:

  • Express 5 и Bootstrap 5.

  • Безопасность: настроил Helmet, прописал строгие CSP заголовки и CORS.

  • Деплой: GitHub Actions -> Docker Hub -> docker-compose -> Traefik с авто-SSL.

Писать код помогал ИИ-ассистент KodaCode. Впечатления положительные: нейронка полностью сняла с меня рутину вроде написания докер-файлов, конфигов Traefik и однотипной верстки под 7+ разных инструментов. Моя задача сводилась к контролю архитектуры и безопасности.

Сайт оптимизировал в том числе под ИИ-поисковики (GEO/AEO), чтобы тот же Яндекс Нейро или Perplexity могли индексировать страницы и предлагать эти утилиты пользователям по прямым запросам.

Посмотреть, что получилось, можно по ссылке выше. Будет интересно узнать, как вы используете ИИ в своей инженерной рутине, и какие специализированные плагины/инструменты можете порекомендовать. За критику по UI/UX сайта также буду благодарен.

Теги:
Всего голосов 4: ↑4 и ↓0+6
Комментарии1

Хай, коллеги!

Около месяца назад, работая над задачей дообучения локальной модели ИИ, я наткнулся на Modern Web Guidance - сборник руководств (skills - навыков) по современной веб-разработке для агентов ИИ от команды Google Chrome. Ознакомившись со сборником, я понял, что большинство руководств человекам тоже не помешали бы😄 Так появился этот репозиторий. Большая часть руководств, выбранных мной для перевода и адаптации, уже готова. Любые исправления, замечания и предложения приветствуются. Пользуйтесь на здоровье и счастливого кодинга!

Теги:
Всего голосов 5: ↑5 и ↓0+9
Комментарии0

Представлен открытый проект Navidrome Music Server, который позволяет слушать музыку с ПК где угодно. Работает очень просто: пользовательский ПК превращается в сервер, к которому можно получить доступ с любого устройства. Есть демо-версия проекта, чтобы понять принцип работы.

Теги:
Всего голосов 1: ↑1 и ↓0+3
Комментарии0
1
23 ...