← На главную

Triptych даст кнопкам action и method для GET и DELETE без JavaScript

29.07.2026 00:12 · hackernews

Проект Triptych предлагает добавить атрибуты action и method прямо элементу <button>. Это позволит кнопкам выполнять GET- и DELETE-запросы без обязательной обёртки в <form>. Идея кажется мелкой, но она закрывает фундаментальную путаницу между кнопками и ссылками.

Ссылки — это адреса, которые можно открыть в новой вкладке, скопировать, сохранить в закладки или отправить другу. Браузер даёт для этого десятки возможностей. Кнопки же — это действия строго в текущем контексте. Их нельзя безнаказанно открыть в другом окне или добавить в «Избранное», потому что они меняют состояние здесь и сейчас. Именно поэтому «Отмена» в форме редактирования не должна быть ссылкой: её задача — просто закрыть режим правки, и показывать для неё опции «Копировать адрес» или «Открыть в новой вкладке» бессмысленно и вредно.

Бытовое мнение «ссылки для навигации, кнопки для всего остального» ошибочно. Кнопки постоянно вызывают переходы: логаут, отправка поиска, сохранение формы меняют URL и загружают новую страницу. А ссылки могут открывать почтовый клиент (mailto:) или скачивать файл, вообще без навигации. Разница не в факте перехода, а в том, что у кнопки переход происходит в фиксированном окружении, которое нельзя переиспользовать.

Сейчас, чтобы сделать кнопку «Отмена» без JavaScript, веб-разработчики вынуждены лепить <a href="/comments/123" class="button">Отмена</a>. Это антипаттерн, но он узаконен дизайн-системами. USWDS официально предлагает добавлять класс usa-button на ссылки и даже включает JavaScript для реакции на пробел. Однако контекстное меню такой псевдокнопки всё равно ведёт себя как у ссылки, читалки и reader mode воспринимают её иначе — семантика сломана.

Button Actions дают честное решение на чистом HTML. Для формы редактирования комментария с полями Save, Save Draft, Cancel и Delete две последние кнопки становятся возможны без скриптов: <button action="/comments/123" method="GET">Отмена</button> и <button action="/comments/123" method="DELETE">Удалить</button>. Первые две используют старый formaction, а две новые — атрибуты action и method из предложения. Это не просто синтаксический сахар: авторы получают удобный способ моделировать полный CRUD-цикл без нарушения HTTP-семантики. Скажем, HackerNews сейчас применяет ссылки для голосования, потому что это просто и не требует скриптов. С Button Actions «лайк» или «апвоут» можно сделать кнопкой с честным POST или PUT.

Автор подчёркивает, что кнопки с DELETE особенно удобны — им редко нужны дополнительные данные. Инициативу поддержал Django Software Foundation. Сам автор готовит анализ безопасности, чтобы продемонстрировать WHATWG отсутствие новых XSS-уязвимостей, и призывает сообщество ставить лайки и делиться примерами на GitHub.

Читать оригинал →