DevTools Console своими руками

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

Увлекательное путешествие в то, как исключительно фронтендом реализовать open-source JavaScript Console, вдохновленную DevTools браузеров.

Получится ли далеко уехать с eval или мы выберем другой подход? Получится ли реализовать autocomplete и eager evaluation? Как устроен вывод значений? Что за синтетические свойства? Посмотрим, насколько глубока эта кроличья нора...

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

В результате сделаем полноценную open-source JavaScript Console в виде сайта, с удобным DX — которую можно использовать для экспериментов с JS, для демонстраций и для шэринга результатов по ссылке, например, своему коллеге.

Будет интересно JavaScript-разработчикам: всем тем, кто ежедневно пользуется консолью в DevTools браузера. И даже самые опытные разработчики наверняка найдут для себя что-то новое!