Обновлённый редактор Хекслета: быстрее старт, горячие клавиши и Тота в контексте практики

На выходных мы выпустили новую версию редактора на платформе Хекслета: удобство работы выросло заметно, плюс пачка точечных улучшений. Редактор у нас клиент-серверный: «ожидание бекенда» было неизбежной частью опыта. Ниже — за счёт чего старт практики ощущается мягче, что появилось для тех, кто любит клавиатуру, и как чат с ассистентом Тотой теперь понимает ваши проверки без копирования лога вручную.

Содержание

• Почему практика не открывалась «мгновенно»
• Новая схема: фронт сразу, бекенд догружает в фоне
• Пока читаете задание — редактор уже готов
• Горячие клавиши и инструкция
• Тота знает про запуски проверок
• Поиск по файлам: fuzzy search и Ctrl+P
• Терминалы помнят историю после обновления страницы
• Техническая сторона: утечки на бекенде
• Курсы, где вы этим редактором пользуетесь каждый день
• Об авторе
• Выводы

Почему практика не открывалась «мгновенно»

Редактор Хекслета — клиент-серверное приложение. Показать только «красивый фронт» недостаточно: для практики нужно поднять бекенд, и это занимает порядка 10–30 секунд.

Бекенд практик спроектирован так, чтобы можно было стартовать задачи почти любой сложности. На фоне могут подниматься база данных, веб-серверы и всё остальное, что заложено в конкретное задание. С точки зрения ученика это выглядело просто: запустил практику — и ждёшь. Мы даже добавляли поясняющий текст, почему это не происходит мгновенно (в реальности устройство ещё чуть сложнее).

Ускорить эту процедуру «в ноль» упорством можно лишь частично; кардинально проблему одним только ускорением бекенда не решить.

Новая схема: фронт сразу, бекенд догружает в фоне

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

Пока читаете задание — редактор уже готов

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

Итог для ученика: текст задания виден сразу, а пока вы читаете и вникаете, редактор успевает подключиться и подготовиться к работе. Ожидание перестаёт ощущаться «пустым временем».

Скриншот из поста в X (Кирилл Мокевнин).

Горячие клавиши и инструкция

Второе крупное изменение — много горячих клавиш. Здесь отдельное спасибо ИИ: он помог сгенерировать код для этого; руками мы до этого постоянно не доходили.

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

Тота знает про запуски проверок

Чат с ассистентом для практик на Хекслете появился давно, но только сейчас сделали нормальную интеграцию с редактором. Тота видит контекст запусков проверок: что отработало, что нет. Копировать вывод в чат больше не нужно.

Поиск по файлам: fuzzy search и Ctrl+P

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

Как открыть: кнопка поиска слева вверху или сочетание Ctrl+P (как список файлов в VS Code и аналогах). Список сочетаний — во вкладке «Инструкция», блок «Горячие клавиши».

Терминалы помнят историю после обновления страницы

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

Техническая сторона: утечки на бекенде

Поправили утечки на бекенде, связанные с редакторами: если теряется соединение, ресурсы не пересоздаются некорректным образом (как бывало раньше). Это про стабильность и предсказуемость сессии.

Курсы, где вы этим редактором пользуетесь каждый день

Практики с редактором в браузере — часть обучения на платформе. Если вы ещё выбираете направление:

• Программист Python — язык, ООП, веб и проекты с практикой в редакторе.
• Фронтенд-разработчик на React — HTML, CSS, JavaScript, React.
• Основы Git — бесплатно: ветки, merge, pull request.
• Code Basics — бесплатные вводные курсы по языкам.

Каталог программ Хекслета — сравнить направления и выбрать свой путь.

---

Об авторе

Кирилл Мокевнин — сооснователь Хекслета, CPO (Chief Product Officer). В индустрии с 2007 года: работал разработчиком в московских компаниях (в том числе в Skype), руководил филиалом и строительством школы обучения. С 2013 года — в Хекслете; под его руководством компания выросла до почти 100 сотрудников.

Лауреат премии HighLoad++ 2019 за вклад в развитие экосистемы интернет-разработки в России. Автор курса «ИИ для разработчиков», ведущий подкаста «Организованное программирование». Пишет и выступает про разработку, образование и применение ИИ в работе программиста.

Первоисточник анонса этого обновления: пост Кирилла в X.

---

Выводы

• Редактор Хекслета остаётся клиент-серверным: бекенд практики поднимает среду под задачу, поэтому «мгновенный» старт был нереалистичен без изменения UX.
• Фронт грузится сразу, ожидание бекенда уходит в фон — меньше ощущения пустого ожидания.
• Пока вы читаете задание, редактор подключается; для типичного сценария это хорошо совпадает по времени.
• Появились горячие клавиши и инструкция по редактору и технологиям.
• Тота интегрирована с редактором: видит проверки, не нужно вручную копировать контекст.
• Для многих файлов доступны fuzzy search, кнопка поиска слева вверху и Ctrl+P.
• После обновления страницы терминалы сохраняют историю.
• На бекенде исправлены утечки при потере коннекта.