Логирование во фронтенд-приложениях. Опыт Звука

Понял, спасибо!

Логирование во фронтенд-приложениях. Опыт Звука

А Next.js как-то предоставляет доступ к контексту, который он создаёт на каждый обработчик запроса?

Логирование во фронтенд-приложениях. Опыт Звука

Поскольку инстанс единый на сервере, то все последующие вызовы методов логера имеют актуальный контекст в рамках одного запроса при SSR

Но это же гарантированная гонка между разными запросами, или под контекстом имеется ввиду Async Local Storage?

Логирование во фронтенд-приложениях. Опыт Звука

Спасибо за статью!

Подскажите, как обогащаете серверные логи юзер-специфичными данными? Начиная от user-agent и ip.

Tramvai — фреймворк для создания веб-приложений

Спасибо за фидбек!

Для такого вида запросов механизм перезапроса не будет применяться, защита тут возможна на нескольких уровнях:
- указать экшену что он должен запускаться onlyServer
- в env переменной API указать что на клиент ее передавать не надо
- вообще код экшена в клиентский бандл не включать

Простой альтернативы Server Actions некста например у нас нет, можно создать API роут и его как BFF юзать но это надо делать вручную.

Tramvai — фреймворк для создания веб-приложений

Мне сложно сказать, так как не знаю что и с чем сравниваете, но предполагаю два варианта:
- приличный сайт это статичный блог
- или это клиентский рендеринг

Сравнивать отдачу статичного HTML из CDN с динамической страницей не очень корректно.

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

Tramvai — фреймворк для создания веб-приложений

Под разные задачи свои инструменты)

Масштабирование SSR-приложений

Почему кстати считаешь что у node.js с ssr больше проблем чем у Symfony с шаблонизатором?

Как на практике работать над перфомансом веб-приложения: опыт Авто.ру

Отличная статья, спасибо!

Масштабирование SSR-приложений

Incremental Static Regeneration у некста в этом плане хороший

Масштабирование SSR-приложений

Привет!

Если есть возможность динамику выполнять только на клиенте, и не пострадает SEO - кажется SSG вполне подойдёт.

Но надо заранее продумать как планируется обновлять контент, добавлять новые страницы - тут уже есть кейсы когда без сервера не обойтись)

Ежегодный отчет Qrator Labs о сетевой безопасности и доступности

Привет!

Расскажите, какие в Qrator используются методы защиты от SYN-flood атак?

Столкнулся с тем, что проходящие через Qrator ip запросы на домен моей организации теряют TCP опцию Window Scale, что заметно влияет на скорость загрузки страниц.

Начали общение с техподдержкой, написали коротко, что это нужно для защиты от не очень интенсивных SYN-flood.
Как я понимаю, проблема с TCP опциями только у защиты SYN cookies, которая не рекомендуется к использованию, как раз из-за проблем с производительностью.

Единый UI-кит и синхронизация дизайна в Учи.ру. Часть 1

Приведу пример, когда у `BarComponent` не будет доступа к контексту `Provider` на сервере:

const App = () => {
  return (
    <Provider>
      <FooComponent>
        <stencil-web-component>
          <BarComponent />
          <button ... />
        </stencil-web-component>
      </FooComponent>
    </Provider>
  )
}

Тут нужно будет отрендерить в строку `stencil-web-component` силами Stencil, затем передать его в `dangerouslySetInnerHTML` родительского тега.
На самом деле, тут даже не понятно, как `BarComponent` отрендерить внутри `stencil-web-component`, ведь аналога `dangerouslySetInnerHTML` у Stencil нет)

Но пока писал, понял что можно делать немного по другому — делать `ReactDOMServer.renderToString` на все приложение, без модификации веб компонентов, а потом парсить полученную строку, и реплейсить каждый веб компонент через `renderToString` Stencil.

Нашел пример с next js, кажется все еще проще — в `stencil.renderToString` просто можно передать строку, которую отрендерил реакт. Прям надо попробовать)

Единый UI-кит и синхронизация дизайна в Учи.ру. Часть 1

Промазал, это к предыдущему треду(

Единый UI-кит и синхронизация дизайна в Учи.ру. Часть 1

Контекст у меня терялся, т.к. для React компонентов, которые внутри Preact, приходилось делать отдельный hydrate

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

На сервере похоже эта проблема останется, т.к. надо отдельно рендерить компоненты через апи stencil/hydrate, и не обойтись без dangerouslySetInnerHtml

Единый UI-кит и синхронизация дизайна в Учи.ру. Часть 1

Спасибо за развернутый ответ, похоже стоит продолжить исследовать тему!)

Единый UI-кит и синхронизация дизайна в Учи.ру. Часть 1

Я как-то исследовал вопрос создания универсального UI-kit, и не смог подружить даже React с Preact, особенно при серверном рендеринге — слишком мало возможностей использования компонента остаётся, ограничения вложенности, плюс потеря context, и так далее

Единый UI-кит и синхронизация дизайна в Учи.ру. Часть 1

Привет!

Подскажите, насколько удобно использовать веб компоненты Stencil в React?

Например, я могу вложить один компонент Stencil в другой внутри React компонента?
Или вложить React компонент внутрь Stencil компонента (все внутри React компонента)?

Как мы распилили монолит. Часть 1

https://nodejs.org/api/vm.html#vm_vm_executing_javascript — если надо выполнить код компонента на сервере.
На клиенте — достаточно вставить скрипт на страницу, но код компонента должен быть обернут в доп. логику, что бы сохранять его в некий глобальный реестр компонентов

Окружение для разработки веб-приложений на TypeScript и React: от 'hello world' до современного SPA. Часть 1

Добавил, спасибо что заметили)