WebDev+ | Веб-разработка
8.26K subscribers
550 photos
247 videos
10 files
718 links
Присоединяйтесь к нашему каналу и погрузитесь в мир веб-разработки

Связь: @devmangx
Download Telegram
Лето начинается: водные развлечения, гриль на острове и новые маршруты в бутик-отеле «Заонежье»

Для гостей бутик-отеля «Заонежье» к новому сезону подготовлены лесные трассы для первых заездов на новых квадроциклах — они позволяют исследовать дикие уголки карельской тайги и скалистые берега озер. Велопрогулки по дорогам Заонежья стали еще комфортнее благодаря электробайкам, которые этой весной пополнили велопарк отеля.

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

Ресторан «Руна» представляет летнюю серию гриль-сетов, которые можно приготовить самостоятельно на одном из необитаемых островов или устроить барбекю на лужайке у дома. В меню — овощные и рыбные сеты, а также мясное ассорти.

Бутик-отель «Заонежье» приглашает к активному отдыху среди озер и северной природы Карелии.
Команды Kubernetes

@WebDev_Plus
Если ты веб-разработчик и юзаешь ИИ… ставь это!

Agent Skills от Addy Osmani (Google) для:

✓ Веб‑производительности
✓ Лучших практик
✓ Доступности (Accessibility)
✓ SEO

Для React, Vue, Angular, Astro или чего угодно.
$ npx add-skill addyosmani/web-quality-skills


@WebDev_Plus
👍3🤣1
Angular 22 теперь с собственным AI Agent Skill.

Установил один раз — и любой кодирующий агент сразу понимает:

Лучшие практики Angular 22
Signals и Signal Forms
Standalone Components
Zoneless Angular
Современная архитектура Angular
Кодинг-конвенции Angular

Теперь агент думает как эксперт по Angular, а не просто генерирует общий код.
Установка:
npx angular-cli-ai install-skill


AI эффективен только в контексте.
Для максимума подключите Angular 22 MCP Server и включите экспериментальные devserver задачи.

#Angular #Angular22 #AI #ClaudeCode #TypeScript #WebDev

@WebDev_Plus
Привет, Laravel-разработчики

Начиная с Laravel v13.15.0, во фасаде Cache появился новый метод rememberWithState().
По сути, этот метод делает две вещи.
Сначала он проверяет, существует ли указанный ключ в кэше. Если ключ найден, метод просто возвращает сохранённое значение. Если ключа нет, выполняется callback, а его результат сохраняется в кэше под этим ключом.
Это полностью совпадает с поведением существующего метода remember().

Но у rememberWithState() есть дополнительная возможность: вместе со значением он возвращает булевый флаг (true или false), который показывает, было ли значение уже в кэше или оно было сгенерировано только что.
Один из полезных сценариев применения — отправка клиенту собственного HTTP-заголовка с информацией о статусе кэша.
Например, можно явно указывать, был ли ответ получен из кэша (cache hit) или сформирован заново (cache miss).

#laravel #php

@WebDev_Plus
Следующий урок, который мы усвоили при масштабной эксплуатации Laravel Scout:
Если в Scout включены очереди, индексация моделей выполняется через фоновые задачи, которые ставятся в очередь при вызове $model->save().

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

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

Это создаёт лишнюю нагрузку, поскольку во время обработки задачи актуальная версия модели заново загружается из базы данных. В итоге каждая дублирующаяся задача повторно получает и индексирует одно и то же финальное состояние модели.
Чтобы решить эту проблему, я отправил PR (который был принят), добавляющий две новые задачи, которые можно включить по желанию. Они реализуют интерфейс ShouldBeUniqueUntilProcessing, который не позволяет ставить в очередь задачи для моделей, уже ожидающих индексации в очереди.

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

@WebDev_Plus
Когда в Node.js появляются тяжёлые вычислительные задачи, производительность приложения может заметно просесть.

Из-за этого многие делают вывод, что Node.js плохо подходит для таких сценариев или что проблема в самом JavaScript. Но решение есть.

В этом руководстве от Sumit Saha подробно разбирается многопоточность в Node.js с помощью Worker Threads.

Что внутри:

* зачем нужны Worker Threads;
* чем они отличаются от Event Loop;
* как выносить CPU-intensive задачи в отдельные потоки;
* обмен данными между потоками;
* практические примеры и паттерны использования.

Хороший материал для тех, кто хочет использовать все возможности Node.js и не блокировать основной поток тяжёлыми вычислениями.

https://freecodecamp.org/news/how-to-implement-multi-threading-in-nodejs-with-worker-threads-full-handbook/

@WebDev_Plus
❤‍🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Этот инструмент проверяет производительность всего сайта.

Он сканирует все страницы и выставляет оценку каждой из них.
Что-то вроде Lighthouse, но с обзором всего сайта целиком.

Запуск:
npx unlighthouse --site <ваш-сайт>


@WebDev_Plus
Хочешь, чтобы твой AI-агент на Laravel использовал недорогую Gemini для простых диалогов, а при сложных задачах автоматически переключался на более мощную модель Claude?
Тогда стоит использовать динамическое переключение моделей
Переопределить модель по умолчанию можно прямо внутри метода prompt().

@WebDev_Plus
Нашёл UI-библиотеку, которая меня прям бесит.

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

Oat:
→ 6KB CSS + 2.2KB JS
→ Ноль зависимостей
→ Не требует фреймворка
→ Без этапа сборки
→ Только семантический HTML

Пишешь <button> — выглядит хорошо.
Пишешь <dialog> — выглядит хорошо.
Пишешь <input> — выглядит хорошо.

Никакого className="px-4 py-2 rounded-md bg-blue-500"

Никаких <Button variant="primary" size="md">

Просто HTML.

Доступность из коробки. Поддержка навигации с клавиатуры. Тёмная тема включена.

https://github.com/knadh/oat

@WebDev_Plus
Твои AI API могут упасть. Лимиты запросов могут закончиться. Но приложение не обязано останавливаться из-за этого.
В #Laravel AI SDK достаточно передать массив провайдеров в аргумент provider.
Если основной API недоступен, Laravel автоматически переключится на следующий провайдер в списке.
Никакой кастомной логики ретраев писать не нужно. 👇

@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
🆕 Представлен MDN MCP Server!

Теперь документацию MDN и данные о совместимости браузеров можно подключить напрямую к AI-агенту или IDE и получать точные, актуальные ответы по веб-платформе.
Больше не нужно полагаться на устаревшие знания из обучающих данных модели.
Что даёт MDN MCP Server:
• прямой доступ к документации MDN;
• актуальные данные о поддержке API и веб-стандартов в браузерах;
• меньше галлюцинаций при работе с веб-разработкой;
• возможность использовать свежую информацию прямо в AI-агентах и редакторах кода.

Полезная штука для тех, кто использует Claude Code, Codex, Cursor и другие MCP-совместимые инструменты при веб-разработке.

@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM