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

И хотя обновления уже вышли и под Андроид, и под Айос, и под десктоп, обновиться на Линуксе вы сейчас вряд ли сможете. Новые версии Телеграма во всех репозиториях появляются с задержкой, к сожалению.
Как подсветить синтаксис
Короткий ответ: танцуя с бубном.
Во-первых, как и в маркдауне, в Телеграме есть два вида моноширинного текста: просто кусочком текста и отдельным блоком.
До этого обновления оба вида отображались в приложениях почти одинаково. А теперь смотрите, какое оно разное: блок кода отображается прям прямоугольничком, и шрифт там меньше. Так вот, подсветка синтаксиса может быть только в блоке.

Но если вы будете писать сообщение, выделите текст, откроете меню форматирования и сделаете его моноширинным — так же, как сделали бы его жирным или наклонным — вы получите простой моноширинный текст, не блоком. Соответственно, никакой вам подсветки.
Сочетание клавиш на десктопе тоже непонятно как работают. Поэтому, чтобы сделать блок кода, вы должны пользоваться этим ужасным встроенным псевдомаркдауном — а именно поставить вокруг кода по три обратных апострофа:
```
print('hello world')
```
Во-вторых, несмотря на то, что Телеграм недавно проводил очередной конкурс среди разработчиков на автоматическое определение языка кода, язык здесь не определяется. Вы должны явно указать его, как в том же маркдауне:
```python
print('hello world')
```
И вот тогда код наконец раскрасится в разные цвета.
А потом начинаются баги. Если отредактировать сообщение с блоком кода, то в начале кода может появиться пустая строчка. Отделить блок кода от следующего параграфа пустой строкой вы не сможете — по крайней мере, у меня на Андроиде не получилось. Написать ```
на Андроиде внутри кода тоже, например, не получится.
На самом деле подсветка синтаксиса была всегда
Сначала небольшое отступление.
Мы разрабатываем тгпай — инструмент для запуска Питона в Телеграм-сообщениях. Это работает так: вы отправляете код, он мгновенно выполняется на сервере, и результат появляется прямо в вашем сообщении.
В коде можно дёргать апи Телеграма и писать свои функции. Поэтому вы можете сделать функцию, которая, к примеру, ищет песню по названию и отправляет её в чат, откуда вы её вызвали. Но про магию тгпая я ещё как-нибудь расскажу в другой статье.
Так вот.
Если вы сейчас зайдёте в Телеграм и посмотрите на сообщения, которые пользователи отправляли через тгпай за последние полгода — вы увидите подсвеченный синтаксис Питона.

Тгпай подсвечивал синтаксис, хотя Телеграм-клиенты это не показывали.
И подсвечивать синтаксис можно было уже много лет.
На стороне сервера эта фича есть так же долго, как и разметка сообщений в принципе. Уже лет семь — или сколько времени существует возможность сделать сообщение жирным или моноширинным? — можно помечать язык кода в сообщении. Просто до сих пор приложения это не использовали.
Теперь подсветку синтаксиса добавили в одном обновлении с другими изменениями внешнего вида сообщений: появилась возможность отвечать на цитаты из сообщений, настраивать превью ссылок, менять цвет своего имени и некоторые другие фичи.
Вот такое обновление
В целом это обновление улучшило UX мессенджера: меню настройки ответов, превью ссылок и пересылки сообщений стали единообразными и довольно удобными, а на плашки ответов и превью теперь кайфово тыкать.
Тем не менее в обновлениях последних лет Телеграм регулярно добавляет фичи в маркетинговых целях и где-нибудь их втыкает, только усложняя интерфейс.
А подсветка синтаксиса бесит :)
Комментарии (55)
DennisP
30.10.2023 09:14-9Я так понимаю, эта фича с подсветкой интересна скорее админам профильных сообществ, а не для переписки. Мало кто будет вставлять этот маркдаун с обратными апострофами чтобы скнинуть несколько строк кода коллгеге.
Evengard
30.10.2023 09:14+16Не знаю как вы, а я регулярно пользуюсь в рабочих чатах. Они у меня правда не в телеграмме, но принцип разметки такой же.
mayorovp
30.10.2023 09:14+29Как участнику ru.SO и бывшему пользователю старой версии Хабра мне писать
```язык
настолько привычно, что я не вижу вообще никаких минусов. И я сильно сомневаюсь что я тут один такой.
SalazarMAX
30.10.2023 09:14+11вы должны пользоваться этим ужасным встроенным псевдомаркдауном — а именно поставить вокруг кода по три обратных апострофа
Почему этот способ назван «псевдомаркдауном», если в маркдауне это делается абсолютно точно так же?
tmat Автор
30.10.2023 09:14Потому что в Телеграме можно форматировать текст как в wisywig, из меню и хоткеями вроде Ctrl+B, и это нормально работает.
И параллельно с этим есть разметка символами как в маркдауне, которая рендерится только после отправки сообщения и которая регулярно ломается и вылезает где не надо: например, когда хочешь отправить с Андроиде пять звёздочек подряд, а они съедаются в одну жирную.
Так вот, любую разметку можно делать обоими способами, а подсветку синтаксиса — только вторым.
3cky
30.10.2023 09:14Мне интересно вот что - можно ли как-то добиться старого поведения? Ну, чтобы строчки в обратных апострофах интерпретировались на стороне клиента не как код, а просто преформатированный текст, без заголовка с "copy". Просто я использую в своем боте тройные апострофы для вставки цитат (не кода) со стороннего ресурса, и теперь это выглядит, мягко говоря, странно, особенно в темной теме. Я, конечно, могу убрать апострофы, но тогда в цитатах придется делать экранирование всех символов markdown, чего хотелось бы избежать.
HemulGM
30.10.2023 09:143cky
30.10.2023 09:14Это на стороне клиента, а я про сообщения, посылаемые через Bot API.
HemulGM
30.10.2023 09:14`mono text`
3cky
30.10.2023 09:14Для inline вставок это работает, но у меня многострочные цитаты.
HemulGM
30.10.2023 09:14Для многострочных тоже работает, если через API (ну и я указывал MarkdownV2 как ParseMode)
HemulGM
30.10.2023 09:14+23cky
30.10.2023 09:14+1Ну то есть все-таки придется экранирование делать, хотя бы для CR/LF. ) Но за идею спасибо!
ForNeVeR
30.10.2023 09:14+1Это не экранирование. Там в коде буквально написано
"`code\r\nline2\r\nline3`"
(в синтаксисе Паскаля, разве что)
HemulGM
30.10.2023 09:14+1Нет, как уже сказали, тут нет экранирования. Здесь просто вставлены переносы кодами символов, т.к. в Делфи (Паскаль) нет строковых литералов и строка содержит именно то, что отображается в коде.
3cky
30.10.2023 09:14Да, спасибо, действительно работает. Хотя я раньше вроде бы пробовал использовать одинарные обратные апострофы, и, видимо, тогда это не сработало, и я перешел на тройные.
Zara6502
30.10.2023 09:14-8простите, но как нужно не любить себя, чтобы пользоваться мессенжерами для таких целей? Я себе любимому когда с работы домой код кидаю или брату кидаю что-то показать, то это или zip или pastebin какой, кидать в мессенджер где наверное только треть ширины экрана будет и весь код превратится в кашу? Там уже подсветка не спасёт. Понятно что для Hello world! пофигу, но у меня почти весь код >100 знаков в строке в среднем и когда в VS открываю два файла рядом, то прям не хватает ширины экрана (у меня 1080р) и хочется 4К, но будет настолько мелко, что приходится страдать, а оверсайз монитор я не хочу покупать за текущую цену.
HemulGM
30.10.2023 09:14+3простите, но как нужно не любить себя (и других), чтобы писать код в ширину выше 80 символов?
Zara6502
30.10.2023 09:14+3ну код не сводится к
int a = 0;
а разбивать одну строку переносами на 10 - это крайняя мера.Вот примеры: (ведущие пробелы сохранены, так как есть уровень вложенности)
case 1: listfiles = listfiles_temp.GetRange(step, listfiles_temp.Count - step); break;
Console.WriteLine(" {1:00}% {2:00}h {3:00}m {4:00}s {0} ", Path.GetFileName(listfiles[i]), (int)(counter * 100 / listfiles.Count), ts.Hours, ts.Minutes, ts.Seconds);
Ну и мы не в 20 веке живём, мониторы современные, железо современные, а вы мне предлагаете код писать в 40 символов на строку как в 1987 году? Мне и тогда этого было мало, писал на строку кода 3 строки, сколько максимально умел принимать интерпретатор, то есть 120 символов. Потому что потом просматривать код активно печатая LIST 10,50 , потом LIST 51,100 потому что всё не влезло на экран было неудобно.
Я постоянно пишу int a=b=c=0; вместо
int a=0;
int b=0;
int c=0;
у экрана строк не так и много, а в ширину он большой, логично эту ширину использовать.
mayorovp
30.10.2023 09:14+1Ну, перед копированием в телегу код можно и отформатировать, тут вы зря придираетесь.
Однако, с тем что в IDE ограничение на 80 символов давно устарело - согласен.
PS если я ничего не напутал, при желании ваш код можно упростить (второй кусок кода отформатирован специально для комментария)
listfiles = listfiles_temp[step..]; // ... Console.WriteLine(" {1:00}% {2:HH}h {2:mm}m {2:ss}s {0} ", Path.GetFileName(listfiles[i]), (int)(counter * 100 / listfiles.Count), ts );
Zara6502
30.10.2023 09:14я уже написал об этом - вниз вы забрали лишних 3 строки абсолютно не поменяв смысла кода, то есть для чтения или правки придется больше гонять экран вверх и вниз, для меня это сомнительная польза, если мне не нужен этот WriteLine то он просто жрёт экранное место, а если мне нужно поработать с WriteLine то мне удобнее всё делать в одной строке, но соглашусь, что незнакомому с кодом будет удобнее читать код разбитый на такие псевдо-блоки.
Я еще кучу всяких if люблю в одну строку писать, особенно если там функционально что-то простое, даже проще ремарку ставить перед строкой, так будет занято две строки не 7 например.
PrinceKorwin
30.10.2023 09:14У меня на проектах ограничение в 80 символов. Причины:
Не у всех большие экраны
При merge review длинные строки вызывают проблемы
tetelevm
30.10.2023 09:14При моём FullHD (который в целом стандарт) часто возникает, что нужно держать 4 вертикальных поля: дерево проекта, два открытых файла и логи запущенного приложения. И даже при моём маленьком размере шрифта (9-10) адекватно отображается как раз именно 80 символов.
В целом всегда пишу по 80, вполне хватает (очень редко до 90-100 строки есть, если в них нет логики, а только строка/длинные названия переменных для распаковки), и норм. Да и пять коротких строк читаются и форматируются намного проще, чем одна, но длинная.
А вообще дело привычки и вкусовщина.
nuclight
30.10.2023 09:14Может просто пользоваться редакторами мержа, в которых такой проблемы не возникает? Ну, vimdiff например.
Zara6502
30.10.2023 09:14-1вот для примера что с моим кодом сделает ТГ
а если запулить таких строк 20 - кто будет разгребать эту кашу? даже если передалть код и сделать его с переносом, то как это читать? Учитывая что C# еще очень толерантен к оформлению по сравнению с питоном где из-за лишнего пробела уже вся программа летит в трубу.
ritorichesky_echpochmak
30.10.2023 09:14+1Кому надо, тот и будет. Это всё ещё лучше, чем выковыривать глазки в MS Teams
ДесктопМобилка, если повернуть её горизонтально
Пробелы на месте, код отлично копируется в IDE при необходимости без потери форматирования, лишних промежуточных строк (которые любят добавлять всякие поделки с вэб-мордой вместо UI)
Zara6502
30.10.2023 09:14-1а зачем вообще использовать промежуточное звено в виде мобилки? Мне бы по FTP и то было бы проще с этим работать.
snaiper04ek
30.10.2023 09:14+1Если вам не нужно - не пользуйтесь.
Не у всех ноги 146-го размера, некоторым нужны сланцы 42-го.
ritorichesky_echpochmak
30.10.2023 09:14А зачем вы скукожили телеграм до размеров мобильного и хотите втолкнуть в него 100500 знаков? Не хотите иметь преимуществ текста - кидайте скрины.
FTP в принципе, к счастью, давно на свалке истории и лучше его не раскапывать. Совершенно очевидно, что это далеко не самый удобный вариант. Я знаю как быстро организовать свой "локальный пастебин" через ShareX -> SSH (SCP) -> любой вэб сервер. С отправкой содержимого буфера (tray -> ShareX -> Upload text) или любого файла (FM -> Меню -> Send to -> ShareX). И много этим пользовался. И это всё ещё не так просто и удобно, как просто кинуть небольшой кусок кода в IM. И само собой в таком ключе не появляется из ниоткуда подсветка - нужно полноценное веб-приложение для хостинга с разукрашкой.
dopusteam
30.10.2023 09:14А вы тг используете чтоб читать код или просто передать с устройства на устройство?
Кажется, во втором случае вообще неважно как он будет выглядеть.
Выше вы приводите пример с какой то глубокой вложенностью, но, кажется, тут не в тг проблема, а в коде, нет?
Не утверждаю, ибо всего кода не вижу, но "смотрите, как тг плохо отображает мою большую вложенность кода" звучит подозрительно
unwrecker
30.10.2023 09:14+1А как нужно не любить себя чтоб в 2023 году жить с монитором в 14 дюймов? :)
HemulGM
30.10.2023 09:14-2У меня 2 24 дюймовых монитора, но это не значит, что я могу писать код в 600 символов в строке. Да, раньше ограничение в 80 символов было из-за аппаратных ограничений, но сейчас это ограничение сохранено, дабы улучшить чтение кода
unwrecker
30.10.2023 09:14+1Да, ограничение может быть и имеет смысл, но 80 символов даже на 24" мониторе - это же узкая колоночка. Я обычно ставлю 120, и то...
SalazarMAX
30.10.2023 09:14+1Даже в ядре уже разрешили 100 символов в строке писать, ограничение 80 в век мониторов 16:9 уже излишнее.
Zara6502
30.10.2023 09:14+1вот еще пример, просто создал новый класс, 56 символов в строке
class VeryFastShannonTree { public VeryFastShannonTree(string path) { } }
это только объявление без кода как такового. Давайте создадим экземпляр класса
VeryFastShannonTree vfstMy = new VeryFastShannonTree();
А что было бы если бы конструктор принимал значения? Так что я считаю и вы и все кто мне минусов накидал живёте в какой-то своей телеграм-питон-реальности.
dopusteam
30.10.2023 09:14-1Аргументы конструктора вполне можно построчно разбить. И не для телеграма, а для удобства
И даже тут у вас отступы большие какие то, это откуда?
mayorovp
30.10.2023 09:14+2Вот так будет короче
var vfstMy = new VeryFastShannonTree(...);
Или вот так
VeryFastShannonTree vfstMy = new(...);
Нет никакого смысла дублировать имя класса когда оно очевидно из контекста.
nuclight
30.10.2023 09:14+1Ровно наоборот, как нужно не не любить себя, чтоб до сих пор страдать от лимита ширины в 80 символов? Мы же не в 70-х, право.
Breathe_the_pressure
30.10.2023 09:14+5Телеграмм становится каким-то многофункциональным паровозом. Может там и дебаггерить можно будет?
Zara6502
30.10.2023 09:14-2да меня уже лет 10 прикалывает постоянно еи упорное сравнение вацапа и ТГ, хотя ТГ кроме факта отправки сообщения ничем более не сопоставим с вацапом, абсолютно самостоятельная софтина с кучей ненужного функционала. Нет чтобы сделать её модульной, какие модули не нужны убрал бы и всё, ан нет, и стикеры и боты и роботы и торговля и код и видео, действительно паровоз. Давно бы уже прикрутили эмуляторы чтобы в игры играть.
Dolios
30.10.2023 09:14+4И хотя обновления уже вышли и под Андроид, и под Айос, и под десктоп, обновиться на Линуксе вы сейчас вряд ли сможете.
Пару дней назад обновление прилетело в Минт.
Сочетание клавиш на десктопе тоже непонятно как работают. Поэтому, чтобы сделать блок кода, вы должны пользоваться этим ужасным встроенным псевдомаркдауном
Это прекрасно, что можно пользоваться привычным инструментом, который работает везде, а не заучивать новые хоткеи в каждом приложении.
NickNal
30.10.2023 09:14+6обновиться на Линуксе вы сейчас вряд ли сможете. Новые версии Телеграма во всех репозиториях появляются с задержкой, к сожалению.
На дебианоидах это так работает:
Качаешь .deb-пакет с оф. сайта Telegram, устанавливаешь через dpkg
При выходе новой версии в приложении появляется кнопка Update Telegram, которая сама обновляет версию приложения
Пользоваться пакетами из apt-репозитория в случае Telegram не надо. там действительно очень древние версии
3cky
30.10.2023 09:14Еще через Flatpak можно поставить, обновления Telegram там появляются достаточно быстро.
Groosha
30.10.2023 09:14+2На гитхабе есть бинарь от разработчика, работает не только под Debian, а, полагаю, на любом линухе (btw I use Arch)
Wohlstand
30.10.2023 09:14+1обновиться на Линуксе вы сейчас вряд ли сможете
Я использую версию не из репозитория, а портативную версию, и она легко обновляется штатно без каких либо репозиториев, и у меня прямо сейчас новейшая версия как раз вместе с подсветкой синтаксиса. Единственно где я использую версию из репозитория, это на одноплатных компьютерах с ARM64 через Flatpak, и то, для меня не критично, потому что там использую Телегу очень редко.
13werwolf13
30.10.2023 09:14И хотя обновления уже вышли и под Андроид, и под Айос, и под десктоп, обновиться на Линуксе вы сейчас вряд ли сможете. Новые версии Телеграма во всех репозиториях появляются с задержкой, к сожалению.
всё зависит от мейнтейнера, в сусе вот многоуважаемый дедмазай собрал быстро, ну а в каком нибудь дебиане и правда годами можно ждать, но дебиан не ставят те кому надо самое свежее здесь и сейчас. ну а для самых нетерпеливых есть варианты взять бинарник с гитхаба или поставить какую нибудь мерзость вроде флатпака или снапа.
lightman
30.10.2023 09:14Да ладно ещё подсветка синтаксиса. Я сегодня скинул в чат CURL команду, а телеграм молча выполнил её и предложил скачать результат запроса. Я, честно говоря, прифигел от такой самодеятельности. А что если этот запрос приведёт к изменению данных, тем более что он POST? Или вызовет отправку уведомлений реальным пользователям как в данном случае (благо запрос не полный и не сработал).
Давно вообще ТГ такое творит?
Hidden text
negasus
Я как то не очень понял, что значит, подсветка синтаксиса была всегда? Что значит "наше приложение"?
Кажется, что использование ```python это стандартный путь
tmat Автор
На стороне сервера была всегда. Некоторые сторонние клиенты (а недавно и один из двух официальных веб-клиентов) это использовали. Под «нашим приложением» я имел в виду тгпай; отредактировал эту фраз.
Стандартный путь в маркдауне. Но (а) всю остальную разметку использовать и без маркдауна, из меню или горячими клавишами, (б) ожидалось автоматическое определения языка, (в) редактирование нафиг кривое — см. первое видео)
HemulGM
Сервер ничего не поддерживал и не поддерживает. Подсветка синтаксиса - это исключительно задача клиента.
dopusteam
А можете ещё раз, как ваше приложение подсвечивало синтаксис? Я ж правильно понимаю, что у вашего приложения нет отдельного интерфейса, работа с ним через телеграм осуществляется?