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


Вчера вышло обновление Телеграма с кучей новых фич для форматирования сообщений: цитатами, ответами на сообщения из других чатов и всем таким.

Теперь можно подсвечивать синтаксис в блоках кода:

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

Как подсветить синтаксис

Короткий ответ: танцуя с бубном.

Во-первых, как и в маркдауне, в Телеграме есть два вида моноширинного текста: просто кусочком текста и отдельным блоком.

До этого обновления оба вида отображались в приложениях почти одинаково. А теперь смотрите, какое оно разное: блок кода отображается прям прямоугольничком, и шрифт там меньше. Так вот, подсветка синтаксиса может быть только в блоке.

Но если вы будете писать сообщение, выделите текст, откроете меню форматирования и сделаете его моноширинным — так же, как сделали бы его жирным или наклонным — вы получите простой моноширинный текст, не блоком. Соответственно, никакой вам подсветки.

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

```
print('hello world')
```

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

```python
print('hello world')
```

И вот тогда код наконец раскрасится в разные цвета.

А потом начинаются баги. Если отредактировать сообщение с блоком кода, то в начале кода может появиться пустая строчка. Отделить блок кода от следующего параграфа пустой строкой вы не сможете — по крайней мере, у меня на Андроиде не получилось. Написать ``` на Андроиде внутри кода тоже, например, не получится.

На самом деле подсветка синтаксиса была всегда

Сначала небольшое отступление.

Мы разрабатываем тгпай — инструмент для запуска Питона в Телеграм-сообщениях. Это работает так: вы отправляете код, он мгновенно выполняется на сервере, и результат появляется прямо в вашем сообщении.

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

Так вот.

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

Тгпай подсвечивал синтаксис, хотя Телеграм-клиенты это не показывали.

И подсвечивать синтаксис можно было уже много лет.

На стороне сервера эта фича есть так же долго, как и разметка сообщений в принципе. Уже лет семь — или сколько времени существует возможность сделать сообщение жирным или моноширинным? — можно помечать язык кода в сообщении. Просто до сих пор приложения это не использовали.

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

Вот такое обновление

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

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

А подсветка синтаксиса бесит :)

Комментарии (55)


  1. negasus
    30.10.2023 09:14
    +11

    Наше приложение подсвечивало синтаксис, хотя Телеграм-клиенты это не показывали.

    Я как то не очень понял, что значит, подсветка синтаксиса была всегда? Что значит "наше приложение"?

    Как подсветить синтаксис. Короткий ответ: танцуя с бубном.

    Кажется, что использование ```python это стандартный путь


    1. tmat Автор
      30.10.2023 09:14
      -4

      что значит, подсветка синтаксиса была всегда?

      На стороне сервера была всегда. Некоторые сторонние клиенты (а недавно и один из двух официальных веб-клиентов) это использовали. Под «нашим приложением» я имел в виду тгпай; отредактировал эту фраз.

      Кажется, что использование ```python это стандартный путь

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


      1. HemulGM
        30.10.2023 09:14
        +23

        Сервер ничего не поддерживал и не поддерживает. Подсветка синтаксиса - это исключительно задача клиента.


    1. dopusteam
      30.10.2023 09:14

      А можете ещё раз, как ваше приложение подсвечивало синтаксис? Я ж правильно понимаю, что у вашего приложения нет отдельного интерфейса, работа с ним через телеграм осуществляется?


  1. DennisP
    30.10.2023 09:14
    -9

    Я так понимаю, эта фича с подсветкой интересна скорее админам профильных сообществ, а не для переписки. Мало кто будет вставлять этот маркдаун с обратными апострофами чтобы скнинуть несколько строк кода коллгеге.


    1. Evengard
      30.10.2023 09:14
      +16

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


    1. mayorovp
      30.10.2023 09:14
      +29

      Как участнику ru.SO и бывшему пользователю старой версии Хабра мне писать ```язык настолько привычно, что я не вижу вообще никаких минусов. И я сильно сомневаюсь что я тут один такой.


  1. SalazarMAX
    30.10.2023 09:14
    +11

    вы должны пользоваться этим ужасным встроенным псевдомаркдауном — а именно поставить вокруг кода по три обратных апострофа

    Почему этот способ назван «псевдомаркдауном», если в маркдауне это делается абсолютно точно так же?


    1. tmat Автор
      30.10.2023 09:14

      Потому что в Телеграме можно форматировать текст как в wisywig, из меню и хоткеями вроде Ctrl+B, и это нормально работает.

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

      Так вот, любую разметку можно делать обоими способами, а подсветку синтаксиса — только вторым.


  1. 3cky
    30.10.2023 09:14

    Мне интересно вот что - можно ли как-то добиться старого поведения? Ну, чтобы строчки в обратных апострофах интерпретировались на стороне клиента не как код, а просто преформатированный текст, без заголовка с "copy". Просто я использую в своем боте тройные апострофы для вставки цитат (не кода) со стороннего ресурса, и теперь это выглядит, мягко говоря, странно, особенно в темной теме. Я, конечно, могу убрать апострофы, но тогда в цитатах придется делать экранирование всех символов markdown, чего хотелось бы избежать.


    1. HemulGM
      30.10.2023 09:14


      1. 3cky
        30.10.2023 09:14

        Это на стороне клиента, а я про сообщения, посылаемые через Bot API.


        1. HemulGM
          30.10.2023 09:14

          `mono text`


          1. 3cky
            30.10.2023 09:14

            Для inline вставок это работает, но у меня многострочные цитаты.


            1. HemulGM
              30.10.2023 09:14

              Для многострочных тоже работает, если через API (ну и я указывал MarkdownV2 как ParseMode)


            1. HemulGM
              30.10.2023 09:14
              +2


              1. 3cky
                30.10.2023 09:14
                +1

                Ну то есть все-таки придется экранирование делать, хотя бы для CR/LF. ) Но за идею спасибо!


                1. ForNeVeR
                  30.10.2023 09:14
                  +1

                  Это не экранирование. Там в коде буквально написано

                  "`code\r\nline2\r\nline3`"
                  

                  (в синтаксисе Паскаля, разве что)


                1. HemulGM
                  30.10.2023 09:14
                  +1

                  Нет, как уже сказали, тут нет экранирования. Здесь просто вставлены переносы кодами символов, т.к. в Делфи (Паскаль) нет строковых литералов и строка содержит именно то, что отображается в коде.


                  1. 3cky
                    30.10.2023 09:14

                    Да, спасибо, действительно работает. Хотя я раньше вроде бы пробовал использовать одинарные обратные апострофы, и, видимо, тогда это не сработало, и я перешел на тройные.


    1. Groosha
      30.10.2023 09:14

      Для цитат теперь отдельная сущность появилась (на скриншоте рядом с моим ответом видно)

      В Bot API завезут очень скоро


      1. 3cky
        30.10.2023 09:14

        Ждём, но подозреваю, что в сущностях цитат всё равно придется делать экранирование для символов markdown.


  1. Zara6502
    30.10.2023 09:14
    -8

    простите, но как нужно не любить себя, чтобы пользоваться мессенжерами для таких целей? Я себе любимому когда с работы домой код кидаю или брату кидаю что-то показать, то это или zip или pastebin какой, кидать в мессенджер где наверное только треть ширины экрана будет и весь код превратится в кашу? Там уже подсветка не спасёт. Понятно что для Hello world! пофигу, но у меня почти весь код >100 знаков в строке в среднем и когда в VS открываю два файла рядом, то прям не хватает ширины экрана (у меня 1080р) и хочется 4К, но будет настолько мелко, что приходится страдать, а оверсайз монитор я не хочу покупать за текущую цену.


    1. HemulGM
      30.10.2023 09:14
      +3

      простите, но как нужно не любить себя (и других), чтобы писать код в ширину выше 80 символов?


      1. 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;

        у экрана строк не так и много, а в ширину он большой, логично эту ширину использовать.


        1. 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
          );


          1. Zara6502
            30.10.2023 09:14

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

            Я еще кучу всяких if люблю в одну строку писать, особенно если там функционально что-то простое, даже проще ремарку ставить перед строкой, так будет занято две строки не 7 например.


            1. mayorovp
              30.10.2023 09:14

              второй кусок кода отформатирован специально для комментария


        1. PrinceKorwin
          30.10.2023 09:14

          У меня на проектах ограничение в 80 символов. Причины:

          • Не у всех большие экраны

          • При merge review длинные строки вызывают проблемы


          1. tetelevm
            30.10.2023 09:14

            При моём FullHD (который в целом стандарт) часто возникает, что нужно держать 4 вертикальных поля: дерево проекта, два открытых файла и логи запущенного приложения. И даже при моём маленьком размере шрифта (9-10) адекватно отображается как раз именно 80 символов.

            В целом всегда пишу по 80, вполне хватает (очень редко до 90-100 строки есть, если в них нет логики, а только строка/длинные названия переменных для распаковки), и норм. Да и пять коротких строк читаются и форматируются намного проще, чем одна, но длинная.

            А вообще дело привычки и вкусовщина.


          1. nuclight
            30.10.2023 09:14

            Может просто пользоваться редакторами мержа, в которых такой проблемы не возникает? Ну, vimdiff например.


      1. Zara6502
        30.10.2023 09:14
        -1

        вот для примера что с моим кодом сделает ТГ

        а если запулить таких строк 20 - кто будет разгребать эту кашу? даже если передалть код и сделать его с переносом, то как это читать? Учитывая что C# еще очень толерантен к оформлению по сравнению с питоном где из-за лишнего пробела уже вся программа летит в трубу.


        1. ritorichesky_echpochmak
          30.10.2023 09:14
          +1

          Кому надо, тот и будет. Это всё ещё лучше, чем выковыривать глазки в MS Teams
          Десктоп

          Мобилка, если повернуть её горизонтально

          Пробелы на месте, код отлично копируется в IDE при необходимости без потери форматирования, лишних промежуточных строк (которые любят добавлять всякие поделки с вэб-мордой вместо UI)


          1. Zara6502
            30.10.2023 09:14
            -1

            а зачем вообще использовать промежуточное звено в виде мобилки? Мне бы по FTP и то было бы проще с этим работать.


            1. snaiper04ek
              30.10.2023 09:14
              +1

              Если вам не нужно - не пользуйтесь.

              Не у всех ноги 146-го размера, некоторым нужны сланцы 42-го.


            1. ritorichesky_echpochmak
              30.10.2023 09:14

              А зачем вы скукожили телеграм до размеров мобильного и хотите втолкнуть в него 100500 знаков? Не хотите иметь преимуществ текста - кидайте скрины.

              FTP в принципе, к счастью, давно на свалке истории и лучше его не раскапывать. Совершенно очевидно, что это далеко не самый удобный вариант. Я знаю как быстро организовать свой "локальный пастебин" через ShareX -> SSH (SCP) -> любой вэб сервер. С отправкой содержимого буфера (tray -> ShareX -> Upload text) или любого файла (FM -> Меню -> Send to -> ShareX). И много этим пользовался. И это всё ещё не так просто и удобно, как просто кинуть небольшой кусок кода в IM. И само собой в таком ключе не появляется из ниоткуда подсветка - нужно полноценное веб-приложение для хостинга с разукрашкой.


        1. dopusteam
          30.10.2023 09:14

          А вы тг используете чтоб читать код или просто передать с устройства на устройство?

          Кажется, во втором случае вообще неважно как он будет выглядеть.

          Выше вы приводите пример с какой то глубокой вложенностью, но, кажется, тут не в тг проблема, а в коде, нет?

          Не утверждаю, ибо всего кода не вижу, но "смотрите, как тг плохо отображает мою большую вложенность кода" звучит подозрительно


      1. unwrecker
        30.10.2023 09:14
        +1

        А как нужно не любить себя чтоб в 2023 году жить с монитором в 14 дюймов? :)


        1. HemulGM
          30.10.2023 09:14
          -2

          У меня 2 24 дюймовых монитора, но это не значит, что я могу писать код в 600 символов в строке. Да, раньше ограничение в 80 символов было из-за аппаратных ограничений, но сейчас это ограничение сохранено, дабы улучшить чтение кода


          1. unwrecker
            30.10.2023 09:14
            +1

            Да, ограничение может быть и имеет смысл, но 80 символов даже на 24" мониторе - это же узкая колоночка. Я обычно ставлю 120, и то...


      1. SalazarMAX
        30.10.2023 09:14
        +1

        Даже в ядре уже разрешили 100 символов в строке писать, ограничение 80 в век мониторов 16:9 уже излишнее.


      1. Zara6502
        30.10.2023 09:14
        +1

        вот еще пример, просто создал новый класс, 56 символов в строке

                class VeryFastShannonTree
                {
                    public VeryFastShannonTree(string path) { }
                }

        это только объявление без кода как такового. Давайте создадим экземпляр класса

                    VeryFastShannonTree vfstMy = new VeryFastShannonTree();

        А что было бы если бы конструктор принимал значения? Так что я считаю и вы и все кто мне минусов накидал живёте в какой-то своей телеграм-питон-реальности.


        1. dopusteam
          30.10.2023 09:14
          -1

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

          И даже тут у вас отступы большие какие то, это откуда?


        1. mayorovp
          30.10.2023 09:14
          +2

          Вот так будет короче

          var vfstMy = new VeryFastShannonTree(...);

          Или вот так

          VeryFastShannonTree vfstMy = new(...);

          Нет никакого смысла дублировать имя класса когда оно очевидно из контекста.


      1. nuclight
        30.10.2023 09:14
        +1

        Ровно наоборот, как нужно не не любить себя, чтоб до сих пор страдать от лимита ширины в 80 символов? Мы же не в 70-х, право.


  1. Breathe_the_pressure
    30.10.2023 09:14
    +5

    Телеграмм становится каким-то многофункциональным паровозом. Может там и дебаггерить можно будет?


    1. Zara6502
      30.10.2023 09:14
      -2

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


      1. nuclight
        30.10.2023 09:14

        Игры там уже много лет есть, только заброшены (как и многое другое).


  1. Dolios
    30.10.2023 09:14
    +4

    И хотя обновления уже вышли и под Андроид, и под Айос, и под десктоп, обновиться на Линуксе вы сейчас вряд ли сможете.

    Пару дней назад обновление прилетело в Минт.

    Сочетание клавиш на десктопе тоже непонятно как работают. Поэтому, чтобы сделать блок кода, вы должны пользоваться этим ужасным встроенным псевдомаркдауном

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


  1. NickNal
    30.10.2023 09:14
    +6

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

    На дебианоидах это так работает:

    1. Качаешь .deb-пакет с оф. сайта Telegram, устанавливаешь через dpkg

    2. При выходе новой версии в приложении появляется кнопка Update Telegram, которая сама обновляет версию приложения

    Пользоваться пакетами из apt-репозитория в случае Telegram не надо. там действительно очень древние версии


    1. 3cky
      30.10.2023 09:14

      Еще через Flatpak можно поставить, обновления Telegram там появляются достаточно быстро.


    1. Groosha
      30.10.2023 09:14
      +2

      На гитхабе есть бинарь от разработчика, работает не только под Debian, а, полагаю, на любом линухе (btw I use Arch)


  1. Wohlstand
    30.10.2023 09:14
    +1

    обновиться на Линуксе вы сейчас вряд ли сможете

    Я использую версию не из репозитория, а портативную версию, и она легко обновляется штатно без каких либо репозиториев, и у меня прямо сейчас новейшая версия как раз вместе с подсветкой синтаксиса. Единственно где я использую версию из репозитория, это на одноплатных компьютерах с ARM64 через Flatpak, и то, для меня не критично, потому что там использую Телегу очень редко.


  1. 13werwolf13
    30.10.2023 09:14

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

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


  1. lightman
    30.10.2023 09:14

    Да ладно ещё подсветка синтаксиса. Я сегодня скинул в чат CURL команду, а телеграм молча выполнил её и предложил скачать результат запроса. Я, честно говоря, прифигел от такой самодеятельности. А что если этот запрос приведёт к изменению данных, тем более что он POST? Или вызовет отправку уведомлений реальным пользователям как в данном случае (благо запрос не полный и не сработал).

    Давно вообще ТГ такое творит?

    Hidden text