JavaScript – самый популярный язык программирования на GitHub


Содержание материала:

ITmentor | Сайт про IT

  • Не выбрано
  • 2020
  • 2020
  • 2020
  • 2020

Месяц

Статьи

15 самых популярных языков программирования по версии GitHub

GitHub опубликовал собственный рейтинг 15 самых популярных языков программирования в 2020 году. Место языка программирования в рейтинге определяется числом pull-запросов пользователей. Рейтинг отражает популярность применения языков программирования в репозиториях. GitHub — крупнейший веб-сервис для хостинга IT-проектов и их совместной разработки. Создатели сайта называют GitHub «социальной сетью для разработчиков».

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

2. Java
Программы на Java транслируются в байт-код, выполняемый виртуальной машиной Java. Достоинством подобного способа выполнения программ является полная независимость байт-кода от операционной системы и оборудования, что позволяет выполнять Java-приложения на любом устройстве, для которого существует соответствующая виртуальная машина.

3. Python
Python — это другой высокоуровневый язык программирования, который часто считается самым легким языком благодаря своей простоте, читаемости и синтаксису. 8 из 10 факультетов информатики в США и 27 из 39 лучших университетов используют Python для обучения студентов программированию.

4. Ruby
Ruby — простой и читаемый язык программирования, ориентированный на разработку веб приложений. Одним из плюсов, делающих Ruby on Rails популярным среди небольших стартапов и глобальных корпораций, является скорость разработки (ёмкость кода и широкий выбор сторонних библиотек).

5. PHP
PHP — это один из наиболее широко используемых языков для разработки динамических веб сайтов. PHP открытый язык разработки, поэтому написаны уже тысячи модулей, которые можно модифицировать до требуемой функциональности. На PHP разработано большинство сайтов, ориентированных на большой объём данных.

6. C++
C++ — идеальный выбор для разработки мощного «настольного» программного обеспечения, игр с функцией аппаратного ускорения, а также приложений для ПК, консолей и мобильных устройств, требующих большого объема памяти для работы. Разработчики С++ имеют огромный спрос на рынке труда.

7. CSS
Cascading Style Sheets (каскадные таблицы стилей) — формальный язык описания внешнего вида документа, написанного с использованием языка разметки. Преимущественно используется как средство описания, оформления внешнего вида веб-страниц, написанных с помощью языков разметки HTML и XHTML, но может также применяться к любым XML-документам.

8. C#
C# является основным языком для разработки на платформах и сервисах Microsoft. Язык С# позволяет разрабатывать практически любые приложения, которые связаны с Visual Studio IDE. Кроме того, это и один из основных языков для разработки игр на движке Unity.

9. C
Язык программирования Си оказал существенное влияние на развитие индустрии программного обеспечения, а его синтаксис стал основой для таких языков программирования, как C++, C#, Java и Objective-C. C ценят за его эффективность; он является самым популярным языком для создания системного программного обеспечения. Изучение этого языка ведет к пониманию и других языков. Язык С используется для разработки низкоуровневых приложений, так как считается ближе всего к аппаратному, уступая только ассемблеру.

10. Go
Был разработан внутри компании Google. Он может рассматриваться как попытка создать замену языку Си. При разработке уделялось особое внимание обеспечению высокоэффективной компиляции.

11. Shell
Shell – не столько язык, сколько интерпретатор команд для выполнения тех или иных действий в операционных системах семейства UNIX. Его скрипты используются, например, для автоматизации обновления ПО. Он содержит стандартные конструкции для циклов, ветвления, объявления функций и так далее.

12. Objective-C
Язык является надмножеством языка C (любой C код компилируется Objective-C компилятором). В язык добавлены: поддержка объектно-ориентированного программирования в стиле Smalltalk (посылка сообщения вместо вызова метода), строки, логический тип. Особенно распространился Objective-C среди разработчиков под платформы Apple.

13. Scala
Этот язык программирования вышел в свет в 2001 году. Его подхватили такие крупные компании, как Airbnb и Apple. По их мнению, на нем проще и быстрее писать приложения для их нужд, нежели на языке Java. Основной целью разработки был язык, обладающий хорошей поддержкой компонентного ПО.

14. Swift
В 2014 года компания Apple представила собственный язык программирования Swift в качестве замены давнему Objective C. Сейчас эту технологию используют LinkedIn, Lyft, Vimeo, Pixelmator и другие компании. Язык программирования Swift популярен у разработчиков во всём мире как новый, простой и быстрый способ разработки для операционных систем OS X и iOS.

15. TypeScript
Язык своим появлением обязан компании Microsoft. Он создан как средство разработки веб-приложений, расширяющее возможности JavaScript.

По версии GitHub самый популярный язык программирования — JavaScript

Публикация в группе : Warehouse

Совсем немного статистики о GitHub за 2020 год. В сообществе используется 337 языков программирования, 24 млн программистов, за год 1 млрд публичных коммитов, больше 25 млн публичных репозиториев.

Самый популярный язык программирования JavaScript

Автор публикации

garry

Комментариев (3)

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

Поясню: выложил доп на гитхаб zoom-image. Так он его определил как javascript — а он на php написан. Ну да есть там и js.
Другой доп magnific-popup-recall — определил вообще как css. Что в корне не верно. Ну и внутренний перфекто говорит мне: «css — не язык программирования!» И никогда им не был. Где вы слышали «Требуется программист css»?

В общем гитхабовские алгоритмы определения языков подвирают. Как поменять язык я искал пару минут — но то ли глубоко спрятали, то ли нет. В общем я забил

Кстати интересное замечание, надо на досуге посмотреть будет на этот момент у них на разных и у себя и тогда коммент сделаю под оригиналом новости. Интересно как и вообще отреагируют или нет))

А когда CSS стал языком программирования? ��
Или я чего-то не понимаю)))

Добавить комментарий Отменить ответ

Войдите, чтобы оставить комментарий.

ИП Плечёв Андрей Владимирович

Передача товаров сайта CODESELLER.RU третьим лицам, а также их перепродажа запрещены и преследуются по закону.

Copyright © 2013-2020 CODESELLER — продажа цифровых товаров. Все права защищены.

Самый популярный язык на GitHub показали на одном графике

JavaScript оказался самым популярным языком программирования среди пользователей GitHub, сообщает сервис для контроля версий и истории при разработке Loggy.

Количество активных хранилищ по языкам программирования на единицу времени (учитываются те, что изменили за прошедший квартал) Количество изменений в активных хранилищах по языкам программирования на единицу времени Сравнение количества изменений в хранилищах по разным языкам программирования за квартал Количество новых ветвей от активных хранилищ по разным языкам программирования Количество открытых источников на активные хранилища по языкам программирования Количество новых просмотров активных хранилищ по языкам программирования Дата выхода разных языков программирования

Для составления графиков Loggy использовал данные, которые открыли клиенты сервиса (около 70% всех пользователей), со II квартала 2012 года по IV квартал 2014 года. На JavaScript в IV квартале 2014-го пришлось 3,4 млн изменений по активным хранилищам. Следующими по популярности стали Java, Ruby (который последний год стагнировал по активным хранилищам), CSS, Python и PHP. Среди набирающих популярность языков можно отметить Go, R и С#. Язык Perl пережил пиковою популярность в III квартале 2012-го (вероятно, после выхода Perl 5.16), однако потом вернулся на прежние позиции.

GitHub опубликовал рейтинги популярности языков программирования за 2020 год

Сервис GitHub представил ежегодный отчет State of the Octoverse 2020, в рамках которого опубликовал ряд рейтингов, посвященных языкам программирования, за 2020 год.

Самый популярный язык

В 2020 году самым популярным языком программирования на GitHub стал JavaScript. На нем было создано больше всего репозиториев.

Рейтинг языков по количеству контрибьюторов

Наиболее популярным языком среди участников сообщества, вносивших изменения в репозитории, также является JavaScript, в то время как Java стабильно удерживает второе место.

Отдельно стоит выделить Ruby, который с 2015 года сильно сдает позиции. В то же время, популярность TypeScript, напротив, в 2020 году активно росла.

Распределение языков по регионам

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

К слову, растущую популярность TypeScript в Южной Америке и Африке эксперты связывают с более молодым сообществом, склонным к использованию новых технологий.

Рост популярности языков

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

Критерии популярных языков программирования по мнению GitHub

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

  • Типобезопасность. Во многих языках, за исключением языка Python, наблюдается рост популярности статической типизации.
  • Интероперабельность. Причина, по которой TypeScript взлетел вверх в рейтингах, — совместимость с JavaScript. То же самое касается Rust и Kotlin, которые взаимодействуют с JavaScript и Java. Аналогично, Swift-разработчики могут напрямую работать с API на Python, не используя каких-либо оберток.
  • Open Source. Все упомянутые языки являются проектами с открытым исходным кодом. По мнению GitHub, активная поддержка Open Source сообществами позволяет языкам стать популярнее у разработчиков.

GitHub опубликовал рейтинги популярности языков программирования за 2020 год

Поделитесь в соцсетях:

Сервис GitHub представил ежегодный отчет State of the Octoverse 2020, в рамках которого опубликовал ряд рейтингов, посвященных языкам программирования, за 2020 год.

Самый популярный язык

В 2020 году самым популярным языком программирования на GitHub стал JavaScript. На нем было создано больше всего репозиториев.

Рейтинг языков по количеству контрибьюторов

Наиболее популярным языком среди участников сообщества, вносивших изменения в репозитории, также является JavaScript, в то время как Java стабильно удерживает второе место.

Отдельно стоит выделить Ruby, который с 2015 года сильно сдает позиции. В то же время, популярность TypeScript, напротив, в 2020 году активно росла.

Распределение языков по регионам

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

К слову, растущую популярность TypeScript в Южной Америке и Африке эксперты связывают с более молодым сообществом, склонным к использованию новых технологий.

Рост популярности языков

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

Критерии популярных языков программирования по мнению GitHub

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

  • Типобезопасность. Во многих языках, за исключением языка Python, наблюдается рост популярности статической типизации.
  • Интероперабельность. Причина, по которой TypeScript взлетел вверх в рейтингах, — совместимость с JavaScript. То же самое касается Rust и Kotlin, которые взаимодействуют с JavaScript и Java. Аналогично, Swift-разработчики могут напрямую работать с API на Python, не используя каких-либо оберток.
  • Open Source. Все упомянутые языки являются проектами с открытым исходным кодом. По мнению GitHub, активная поддержка Open Source сообществами позволяет языкам стать популярнее у разработчиков.

Три самых популярных языка программирования в 2020 году

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

1. JavaScript

JavaScript – динамический язык программирования, который в основном позволяет добавлять сайтам интерактивность. Многие советуют начинать изучать программирование именно с него.

Stack Overflow, популярный сайт, где программисты делятся своими навыками, каждый год проводит опрос среди программистов и составляет статистику – от зарплат до любимых технологий. В январе 2020 года сайт опросил более чем 100 тысяч разработчиков.

График самых популярных языков программирования, согласно Stack Overflow:

6-8 декабря 2020 пройдет хакатон Rosbank Tech.Madness. Нужно просто зарегистрироваться до 24.11 и ждать отбора. Описание идеи в заявке не требуется.

JavaScript возглавляет этот список уже шестой год подряд.

GitHub, крупнейший веб-сервис для хостинга IT-проектов, также называет JavaScript самым популярным языком программирования.

Согласно опросу Stack Overflow, разработчики JavaScript зарабатывают около $55 тысяч в год. Программисты в США, использующие этот язык, зарабатывают около $98 тысяч в год.

По оценкам Indeed.com, популярного сайта для поиска работы, разработчик JavaScript в США в среднем зарабатывает около $110945 в год.

2. Java

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

Индекс TIOBE, оценивающий популярность языков программирования, назвал Java самым популярным языком в июле 2020 года.

Согласно опросу Stack Overflow, популярность Java составляет 45,3% – язык занимает почетное второе место в их таблице (если не считать HTML, CSS, SQL – которые по сути не являются языками программирования).

Опрос показал, что в США разработчики Java зарабатывают $100 тысяч в год. Indeed.com дает похожие оценки – программист Java в США зарабатывает $100873 в год.

3. Python

Python – мощный высокоуровневый язык программирования, набирающий большую популярность в 2020 году. Его используют для разных заданий – включая веб-разработку, машинное обучение и анализ данных.

38,8% юзеров Stack Overflow для своих проектов используют Python. Согласно опросу сайта, по популярности Python в 2020 обогнал C# – а в 2020 году он обогнал PHP.

На платформе GitHub Python разместился на втором месте в списке самых популярных языков программирования.

Стоит также упомянуть, что развитие ИИ, вероятно, способствует росту спроса на Python. Stack Overflow называет его «самым быстрорастущим языком программирования».

Согласно опросу Stack Overflow, разработчики Python зарабатывают в среднем $56 тысяч в год. В США, по оценкам Indeed.com, они получают $114811 в год.

JavaScript, Java и Python – самые востребованные языки программирования в 2020 году. Если вы хотите сделать еще один шаг вперед в своей карьере, начните изучать один из них.

Материалы по теме:

Нашли опечатку? Выделите текст и нажмите Ctrl + Enter

ITmentor | Сайт про IT

  • Не выбрано
  • 2020
  • 2020
  • 2020
  • 2020

Месяц

Статьи

15 самых популярных языков программирования по версии GitHub

GitHub опубликовал собственный рейтинг 15 самых популярных языков программирования в 2020 году. Место языка программирования в рейтинге определяется числом pull-запросов пользователей. Рейтинг отражает популярность применения языков программирования в репозиториях. GitHub — крупнейший веб-сервис для хостинга IT-проектов и их совместной разработки. Создатели сайта называют GitHub «социальной сетью для разработчиков».

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

2. Java
Программы на Java транслируются в байт-код, выполняемый виртуальной машиной Java. Достоинством подобного способа выполнения программ является полная независимость байт-кода от операционной системы и оборудования, что позволяет выполнять Java-приложения на любом устройстве, для которого существует соответствующая виртуальная машина.

3. Python
Python — это другой высокоуровневый язык программирования, который часто считается самым легким языком благодаря своей простоте, читаемости и синтаксису. 8 из 10 факультетов информатики в США и 27 из 39 лучших университетов используют Python для обучения студентов программированию.

4. Ruby
Ruby — простой и читаемый язык программирования, ориентированный на разработку веб приложений. Одним из плюсов, делающих Ruby on Rails популярным среди небольших стартапов и глобальных корпораций, является скорость разработки (ёмкость кода и широкий выбор сторонних библиотек).

5. PHP
PHP — это один из наиболее широко используемых языков для разработки динамических веб сайтов. PHP открытый язык разработки, поэтому написаны уже тысячи модулей, которые можно модифицировать до требуемой функциональности. На PHP разработано большинство сайтов, ориентированных на большой объём данных.

6. C++
C++ — идеальный выбор для разработки мощного «настольного» программного обеспечения, игр с функцией аппаратного ускорения, а также приложений для ПК, консолей и мобильных устройств, требующих большого объема памяти для работы. Разработчики С++ имеют огромный спрос на рынке труда.

7. CSS
Cascading Style Sheets (каскадные таблицы стилей) — формальный язык описания внешнего вида документа, написанного с использованием языка разметки. Преимущественно используется как средство описания, оформления внешнего вида веб-страниц, написанных с помощью языков разметки HTML и XHTML, но может также применяться к любым XML-документам.

8. C#
C# является основным языком для разработки на платформах и сервисах Microsoft. Язык С# позволяет разрабатывать практически любые приложения, которые связаны с Visual Studio IDE. Кроме того, это и один из основных языков для разработки игр на движке Unity.

9. C
Язык программирования Си оказал существенное влияние на развитие индустрии программного обеспечения, а его синтаксис стал основой для таких языков программирования, как C++, C#, Java и Objective-C. C ценят за его эффективность; он является самым популярным языком для создания системного программного обеспечения. Изучение этого языка ведет к пониманию и других языков. Язык С используется для разработки низкоуровневых приложений, так как считается ближе всего к аппаратному, уступая только ассемблеру.

10. Go
Был разработан внутри компании Google. Он может рассматриваться как попытка создать замену языку Си. При разработке уделялось особое внимание обеспечению высокоэффективной компиляции.

11. Shell
Shell – не столько язык, сколько интерпретатор команд для выполнения тех или иных действий в операционных системах семейства UNIX. Его скрипты используются, например, для автоматизации обновления ПО. Он содержит стандартные конструкции для циклов, ветвления, объявления функций и так далее.

12. Objective-C
Язык является надмножеством языка C (любой C код компилируется Objective-C компилятором). В язык добавлены: поддержка объектно-ориентированного программирования в стиле Smalltalk (посылка сообщения вместо вызова метода), строки, логический тип. Особенно распространился Objective-C среди разработчиков под платформы Apple.

13. Scala
Этот язык программирования вышел в свет в 2001 году. Его подхватили такие крупные компании, как Airbnb и Apple. По их мнению, на нем проще и быстрее писать приложения для их нужд, нежели на языке Java. Основной целью разработки был язык, обладающий хорошей поддержкой компонентного ПО.

14. Swift
В 2014 года компания Apple представила собственный язык программирования Swift в качестве замены давнему Objective C. Сейчас эту технологию используют LinkedIn, Lyft, Vimeo, Pixelmator и другие компании. Язык программирования Swift популярен у разработчиков во всём мире как новый, простой и быстрый способ разработки для операционных систем OS X и iOS.

Топ-пост этого месяца:  Стилизация маркеров списка в CSS

15. TypeScript
Язык своим появлением обязан компании Microsoft. Он создан как средство разработки веб-приложений, расширяющее возможности JavaScript.

Стоит ли учить JavaScript: перспективы, ситуация на рынке труда, мнения экспертов

JavaScript входит в число самых популярных языков программирования, а фронтенд-разработка считается одним из самых простых способов начать карьеру в IT. В этой статье поговорим о целесообразности изучения JavaScript, перспективах этого языка, ситуации на рынке труда. Комментарии известных в отрасли экспертов помогут понять, стоит ли учить JavaScript, есть ли шанс получить работу и не устареют ли полученные знания в ближайшее время.

Экскурс в теорию: информация о JavaScript, сферах применения и особенностях языка

JavaScript (JS) — высокоуровневый язык программирования, который поддерживает императивный, функциональный и событийно-ориентированный стили. Относится к языкам с динамической типизацией, входит в группу интерпретируемых языков.

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

В число основных особенностей JS входят:

  • Динамическая типизация — тип данных определяется в момент присваивания значения константе или переменной.
  • Интерпретируемый язык — код приложения интерпретируется при обращении, не требуется предварительная компиляция.
  • Функции как объекты первого класса, то есть функции в JavaScript можно возвращать из функций, передавать в качестве параметров в другие функции, присваивать переменным.
  • Поддержка прототипного и объектно-ориентированного подхода.
  • Универсальность — все популярные браузеры поддерживают JavaScript.

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

Важная особенность JavaScript — развитая инфраструктура. Вокруг этого языка программирования сформировано многочисленное сообщество. Разработчикам доступны мощные инструменты, например:

  • Библиотеки и фреймворки для создания приложений (React, Vue).
  • Сборщики (Webpack, Gulp).
  • Вспомогательные библиотеки (Lodash, Underscore).
  • Генераторы статических сайтов (Gatsby.js, Next.js).

Сферы применения JavaScript

В первую очередь JavaScript широко используется во фронтенд-разработке. Этот язык вместе с HTML и CSS входит в базовый набор инструментов фронтендера. На JavaScript создаются приложения, которые исполняются в браузере на стороне клиента. Они обеспечивают интерактивность сайтов. Например, когда пользователь заполняет форму и нажимает кнопку «Подписаться», мгновенная реакция на это действие обычно обеспечивается кодом, написанным на JavaScript.

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

  • Разработка нативных приложений. Например, с помощью фреймворка React Native создаются приложения для Android и iOS.
  • Серверная разработка. Например, Node.js применяется для бэкенд-разработки. Об этом направлении в перспективе выйдет отдельная статья.
  • Разработка десктопных приложений. Например, JS применяется в офисных пакетах Microsoft и OpenOffice, в приложениях компании Adobe.
  • Программирование оборудования и бытовой техники, например, платёжных терминалов, телевизионных приставок.

В данной статье рассматривается перспектива изучения JavaScript для использования в разработке фронтенда.

Популярность, рейтинг и перспективы JavaScript

Как отмечалось выше, по состоянию на середину 2020 года JavaScript входит в число самых популярных языков программирования. JS занимает седьмое место в индексе TIOBE, который составляется на основе статистики поисковых запросов. Этот язык на данный момент популярнее, чем PHP, Swift, Objective-C, Ruby.

JavaScript занимает первое место по популярности в сообществе разработчиков на GitHub. Этот показатель рассчитывается по количеству репозиториев.

Как и PHP, JavaScript можно считать одним из способов быстро войти в разработку. JavaScript-программистов берут на работу веб-студии, которые есть как в крупнейших городах, так и в регионах.

О перспективах JavaScript подробно рассказывают эксперты в комментариях ниже. Стоит обратить внимание на два момента.

Первый: как отмечалось выше, JavaScript обеспечивает интерактивность сайтов и используется в популярных современных браузерах. Эти задачи можно решать и с помощью альтернативных технологий, например, WebAssembly, но это не вопрос краткосрочной перспективы. В ближайшем будущем с большой долей вероятности JS останется основным языком программирования фронтенд-приложений.

Второй момент: в настоящий момент растет популярность прогрессивных веб-приложений (PWA, progressive web apps). Эту технологию активно продвигает Google. Прогрессивные веб-приложения представляют собой гибрид сайта и мобильного приложения. В среднесрочной перспективе у PWA есть хорошие шансы отвоевать значительную долю рынка у нативных приложений.

Для разработки PWA применяется JavaScript. Например, сайты, созданные с помощью генератора Gatsby.js, поддерживают функциональность прогрессивного веб-приложения из коробки. Это ещё один плюс в пользу востребованности JS в ближайшей перспективе.

Сколько платят фронтендерам, или О зарплатах JavaScript-программистов

Заработок JavaScript-программиста зависит от уровня квалификации, региона проживания и работы, режима трудоустройства.

По данным trud.com на май 2020 года, средняя зарплата JavaScript-разработчика в России составляет 100 000 рублей. Больше всего вакансий на этом ресурсе с предложением зарплаты в диапазоне от 62 000 до 121 000 рублей (см. иллюстрацию). Чаще всего фронтенд-разработчики требуются в Москве, Санкт-Петербурге и Новосибирске.

По данным NewHR, вилка зарплат фронтенд-разработчиков уровня middle в июне 2020 года составляла от 160 000 до 190 000 рублей. По информации «Мой круг», медианная зарплата JavaScript-программиста в России во втором полугодии 2020 года составляла 85 000 рублей.

На сайте hh.ru по состоянию на конец июля 2020 года есть 81 вакансия для JavaScript-разработчиков в Казани (город взят для примера). Уровень зарплаты варьируется от 20 000 до 165 000 рублей.

Информацию по своему региону можно получить самостоятельно с помощью сайтов поиска работы.

Перспективы JavaScript: взгляд экспертов

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

Сергей Рубанов: спрос на рынке труда JavaScript-разработчиков сильно превышает предложение

По вашему опыту, почему стоит изучать JS?

Несмотря на то, что JS имеет свои странности, он невероятно прост для изучения и терпим к ошибкам. Экосистема языка хорошо развита, так что если вы чувствуете в себе силы, то сможете легко настроить более строгие правила для написания кода, используя различные инструменты, позволяющие избегать популярных ошибок или даже добавить статическую типизацию. В данный момент JavaScript — единственный высокоуровневый динамический язык, доступный практически везде, в том числе (и в первую очередь) на веб-страницах. Это позволяет выучить один язык, частично переиспользовать готовые наработки для клиента, сервера, в роботостроении, для интернета вещей, даже для машинного обучения. А ещё у JavaScript огромное, невероятно классное и самое открытое комьюнити.

Какие перспективы у этого языка программирования по сравнению с другими языками?

JavaScript — один из самых распространенных языков в мире. В индексе TIOBE в данный момент он занимает 7 место (и индекс растет), а по количеству репозиториев на GitHub и популярности по результатам опроса Stack Overflow он находится на первом месте и является вторым желаемым языком после Python. Пакетный менеджер npm является самым крупным пакетным менеджером из всех существующих. Все это говорит о том, что перспективы у языка великолепные.

Будет ли он востребован в будущем?

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

Каковы перспективы JS-разработчика на рынке труда?

Спрос на рынке труда JavaScript-разработчиков сильно превышает предложение, отсюда же и хорошие зарплаты. Компании ищут разработчиков любого уровня, в том числе начинающих.

Почему новичку стоит обратить внимание на этот язык?

количество информации, которую можно найти в интернете;

развитая экосистема в виде огромнейшего количества библиотек и инструментов для разработки;

очень хорошее комьюнити;

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

высокий спрос на рынке труда;

Сергей Рубанов, опытный разработчик и лидер сообществ. Приглашённый эксперт TC39 (комитет, который занимается разработкой языка JavaScript), участник WebAssembly Community Group, член команды Babel, соорганизатор BeerJS Moscow, WebAssembly Moscow, ведущий канала Juliarderity (совместно с Романом Дворновым).

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

По вашему опыту, почему стоит изучать JS?

JavaScript в последние годы стал набирать безумные обороты.

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

А в браузерах обосновался старичок JavaScript. Причем если лет 5-10 назад было стыдно говорить, что ты программируешь на JavaScript, так как его было сложно считать удобным и производительным языком, то после выхода ES6 удобство резко возросло и продолжает расти благодаря работе комитета TC39 (куда входят куча спецов из больших компаний), который развивает синтаксис языка.

Производительность языка постоянно увеличивается. Но благодаря большому комьюнити, интересу больших интернет гигантов к языку, неуклонно растет количество инструментария, которые сильно облегчает разработку. Например, ESlint (проверка стиля кода), Prettier — автоформатирование кода, Babel — для транспилинга кода и напиcания всяких AST-трансформеров, JIT-компиляторов.

Но что не может не радовать, так это TypeScript, который позволяет писать статически типизированный код (Flowtype проиграл для меня войну). Статическая типизация позволяет писать более стабильный и качественный код, дает плюшки автоподстановки в IDE. В общем, корпоративный сектор все больше задач может доверить миру JavaScript. Современный джаваскрипт с классами, декораторами, интерфейсами, типизацией все больше и больше становится похожим на Java в хорошем смысле этого слова. А если учесть, что JavaScript сейчас работает как на клиенте (в браузере), так и на сервере (NodeJS), то это это для бизнеса открывает возможность писать изоморфные приложения.

Будет ли этот язык востребован в будущем?

За пару лет популярность JS должна будет только расти. Ведь столько еще чудовищных интерфейсов вокруг, столько мертвых страниц, сгенерированных сервером. JS будет теснить PHP и Ruby.

Так или иначе JavaScript еще будет востребован как минимум лет 10, дальше прогнозировать сложно.

Что угрожает JavaScript/TypeScript:

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

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

В любом случаем надо постоянно учиться и развиваться, чтоб соответствовать текущему времени. Но, к бабке не ходи, лет через 10 надо точно будет чему-то сильно переучиваться.

Каковы перспективы разработчика JS на рынке труда?

Сейчас есть некий перекос в сторону фронтенд-разработчиков, которые производят wow-эффект на клиентов. К примеру, на Украине сейчас активно ищутся React/Vue/Angular разработчики. И нередко зарплата таких фронтенд-специалистов с опытом 1-2 года по зарплате соизмерима со среднестатистическим Java-бэкендером с опытом 6-8 лет. Нужны легкие деньги после универа?! Вперед в JS!

Почему новичку стоит обратить внимание на JS?

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

Павел Черторогов, архитектор информационных систем, GraphQL-гуру.

Роман Дворнов: JavaScript вряд ли куда-либо денется в ближайшие годы

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

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

Кстати, о новом. JavaScript — один из немногих языков с таким немалым возрастом (был создан в декабре 1995-го), который настолько динамично развивается сегодня. Формально все началось в 2015 году, когда вышла новая редакция ES2015 (или ES6) и было решено выпускать новую редакцию каждый год, хотя на самом деле всё началось задолго до этого. Не каждый год случаются значительные изменения, но изменения происходят и чувствуется темп. Можно следить за работой TC39 (комитет работающий над спецификацией языка), участвовать в обсуждениях предложений, вносить свои предложения и так далее – процесс открыт, и это здорово. К тому же, сегодня имплементаторы внедряют новые фичи накануне принятия новой редакции спецификации языка, а не несколько лет спустя, как это было раньше.

Низкий порог входа всегда был предметом споров: с одной стороны, вовлекается больше людей, с другой — их уровень как специалистов невысок. Это, плюс часто неглубокое изучение, обычно и создает негативное отношение к языку. Чтобы использовать JavaScript эффективно, его нужно изучать полностью, и дополнительно множество смежных областей, а особенно Computer Science, как это делают в случае с другими языками. Все больше задач с применением JavaScript не уступают по сложности задачам решаемым с другими языками.

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

Во-вторых, необходимость шарить логику между клиентом и сервером, Server Side Rendering и прочее, укрепляет позиции JavaScript на серверной стороне. В-третьих, тулинг для JavaScript, как и для клиентского веб-стека, по большей части написан на JavaScript.

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

Роман Дворнов, эксперт в области фронтенд-разработки, ведущий канала Juliarderity (совместно с Сергеем Рубановым). Профиль на GitHub.

Андрей Оконечников: будем ли мы писать JS через несколько лет — неизвестно, но 99% что мы будем продолжать компилировать в JS

По вашему опыту, почему стоит изучать JS? Какие перспективы у этого языка программирования по сравнению с другими языками?

Несмотря на интересные альтернативы, такие как ReasonML, Kotlin и уже существующие языки, которые компилируются в JS, такие как ClojureScript и Elm, это никак особенно не влияет на всё растущую популярность JS. Причина для того, на мой взгляд, в низком пороге входа и огромной экосистеме (npm). На JS написано несколько миллионов опенсорс модулей, которые можно установить за считанные секунды. Плюс возможность открыть консоль разработчика в браузере и начать писать код.

Развитие распределенных сред разработки, которые работают напрямую из браузера, например CodeSandbox, ещё более уменьшают порог входа для новичков. Инструменты разработки становятся лучше и лучше, позволяя использовать JS в больших командах.

Одновременно с этим, растущая производительность JS runtimes, например V8, делает использование этого языка все более приемлемым на платформах вне веб-браузеров.

Благодаря инициативам ECMA этот язык также очень быстро развивается, получая все более современные фичи.

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

Будет ли JS востребован в будущем?

JavaScript никуда не денется в ближайшее время, хотим мы того или нет. На этом языке уже сейчас написано огромное количество кода, и количество это будет только увеличиваться. И даже если появится более современный язык, веб-браузеры все равно будут вынуждены поддерживать JS. Так устроен web — вечная совместимость. Будем ли мы писать JS через несколько лет — неизвестно, но 99% что мы будем продолжать компилировать в JS.


Каковы перспективы разработчика JS на рынке труда? Почему новичку стоит обратить внимание на JS?

Сейчас перспективы как никогда лучше. Особенно связанные с фронтендом. Веб превращается в платформу для по-настоящему сложных приложений, и рынок просто не способен удовлетворить потребность компаний. Но JS не единственный фактор. Умение писать CSS и доступный HTML важны сегодня как никогда. Рынок JS разработчиков наполняется в основном из backend-разработчиков, переквалифицирующихся во frontend. Если вы видите себя во frontend, я бы очень рекомендовал обратить внимание на основы дизайна, user experience, HTML + CSS и, конечно же, JavaScript.

Если вы дизайнер и уже умеете писать разметку и CSS, я бы так же советовал начать изучать JavaScript. В будущем граница между JS и CSS-программистами будет исчезать, так как очень сложно сделать хороший user experience в Web без использования обоих языков.

Андрей Оконечников, фронтенд-разработчик и UI-дизайнер родом из Ярославля, живущий в Вене, Австрия. Более 10 лет он придумывает и разрабатывает пользовательские интерфейсы, используя современные веб-технологии. До этого он работал дизайнером веб-сайтов и пользовательских интерфейсов. Комбинация опыта дизайнера и разработчика помогает ему лучше понимать проблемы пользователей и находить оригинальные решения в пользовательских интерфейсах.

Андрей работал с такими компаниями, как Yandex, JetBrains, Feedly, Netlify и многими другими. Он основатель консалтинг-компании component-driven.io, специализирующейся на дизайн системах и сложных веб-интерфейсах, и создатель macOS приложения цветовой пипетки для разработчиков и дизайнеров ColorSnapper.

Александр Казаченко: на одного подходящего кандидата приходится 10 или более неподходящих, это печалит

По вашему опыту, почему стоит изучать JS?

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

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

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

И на сервере JS тоже имеет свою нишу в виде Nodejs.

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

Но если посмотреть не с точки зрения прагматизма, а с точки зрения энтузиазма, то в этом смысле JS тоже очень привлекателен.

Сейчас существует множество языков, транспилирующихся в JS (TypeScript, CoffeeScript, Kotlin и так далее), много фреймворков и библиотек разного уровня абстрактности, что позволяет разрабатывать на JS так, как нравится именно вам.

Какие перспективы у самого языка программирования в сравнении с другими? Будет ли он востребован в будущем?

Как я отмечал выше, у JS очень большой рынок, где он востребован и где ему нет аналогов (веб-браузер).

Соответственно, можно считать, что в ближайшие лет 10 JS не только не умрет, но и будет активно развиваться.

На какое направление при изучении JS обратить больше внимания — frontend или backend?

Изначально JS применялся сугубо для frontend’а, соответственно и развился он больше в эту сторону. Но это не имеет никакого значения, при выборе направления — frontend или backend. Более значимым в этом выборе будет то, чем интересно заниматься именно вам. Так как язык один и тот же, разница только в окружении.

Какие перспективы у JS-разработчика в работе? Почему новичку стоит обратить внимание на этот язык программирования?

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

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

Топ-пост этого месяца:  Captcha плагины WordPress плагины для вставки Капчи на сайт

За последние 3 года я прособеседовал не менее 200 человек, и на одного подходящего кандидата приходится 10 или более неподходящих, это печалит.

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

Стоит ли браться за JavaScript: итоги

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

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

Примечание: мнение экспертов может не совпадать с мнением администрации и сотрудников Хекслета.

Языки программирования на GitHub

Что может быть лучше сравнения популярности и использования языков программирования в интерактивном режиме? Главный помощник программисту в этом деле, как известно, — сайт GitHut, использующий данные сервиса GitHub для сравнительного рейтинга актуальности языков, пишет i-programmer.info.

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

Сервис GitHub стал основным способом размещения ИТ-проектов и их совместной разработки. Как результат, данные о количестве проектов, написанных на тех или иных языках, дают представление об их популярности.

Если быть более точным, рейтинг языков формируется исходя из данных об активных репозиториях по каждому из них. Глядя на общее количество пушей, пушей на количество репозиториев и новых форков на количество репозиториев, можно получить представление о том, насколько сообщество этого языка активно на GitHub. Вы также можете обратить внимание на показатель числа проблем на репозиторий и количество новых подписчиков на репозиторий, но данная информация менее понятна для восприятия.

«Дополнительная информация кроется во множестве записей, не указывающих язык программирования. То же можно сказать и о невозможности определить язык репозитория при создании. Из-за этого не представляется возможным назвать наиболее популярные языки в зависимости от количества недавно созданных репозиториев. Потому значение активности (количества внедрённых изменений) считается наилучшим показателем популярности языка программирования», — отмечает GitHut.

На githut.info вы можете выбрать любой язык по горизонтали и увидеть его положение в рейтинге по другим параметрам. Верхнюю строчку занимает JavaScript с наибольшим количеством репозиториев и пушей. Однако среднее количество пушей на репозиторий и количество новых форков указывает на то, что этот язык используется не так активно, как некоторые другие.

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

Существуют также любопытные различия в поведении языков программирования. К примеру, обратите внимание на язык R. У него нет большого числа репозиториев на GitHub и количество пушей на репозиторий сравнительно низкое. Тем не менее, R занимает первое место по количеству новых форков. Почему? Получается, для статистических программ проще взять репозиторий целиком и подправить его, чем внести необходимые изменения в основной проект?

Такая же картина характерна и для нового языка Swift от Apple.

Конечно, при упомянутых статистических расчётах невозможно избежать ошибок. Большой проблемой GitHub также является классификация проектов на основе используемых в нём расширений файлов. Такие показатели нередко могут быть ошибочными. Поэтому не воспринимайте рейтинг как истину в последней инстанции.

Как работает JavaScript: часть первая

JavaScript — самый популярный язык программирования в репозиториях Гитхаба. Любой фронтенд-разработчик имеет с ним дело, а Node.js активно используется в бэкенд-разработке. Но понимаете ли вы, как на самом деле устроен JavaScript?

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

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

Как работает JavaScript: движок, рантайм, стек вызовов

По мере роста популярности JavaScript команды разработчиков используют его на многих уровнях своих приложений: на веб-страницах, в бэкенде, гибридных приложениях, на мобильных устройствах. Как можно увидеть на Github Stats, JavaScript сейчас на первом месте рейтинга по количеству активных репозиториев и общему количеству пушей, и не сильно отстает в других категориях.

Прим. переводчика: вот актуальная статистика по языкам: madnight.github.io/githut

Если проекты становятся настолько зависимыми от JavaScript, это значит, что разработчики вынуждены лучше знакомиться с языком и углубляться в тонкости его реализации, чтобы продолжать делать хорошие приложения.

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

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

Если вы относительно недавно знакомы с JavaScript, этот пост поможет вам понять, почему JavaScript такой «странный» относительно других языков. А если вы уже опытный JavaScript–разработчик, я надеюсь, что статья покажет что-то новое о том, как работает язык, с которым вы работаете каждый день.

Движок JavaScript

Популярный пример движка JavaScript — это V8 от Google. Он используется, к примеру, внутри Chrome и Node.js. Вот сильно упрощенная модель того, как он выглядит изнутри:

Движок состоит из двух основных частей:

  • Куча — место, где происходит выделение памяти
  • Стек вызовов — место, где выполняется код, организованный в кадры вызовов

Среда выполнения

В браузере есть куча API, которыми пользуется почти каждый разработчик, например setTimeout. Эти API, однако, не предоставляются движком. Так откуда они берутся? Оказывается, что реальность несколько сложнее.

Итак, у нас есть движок, но кроме этого еще куча всего. У нас есть эти штуки, которые мы называем Web API, предоставляемые браузером, всякие DOM, AJAX, setTimeout и еще много всего. И еще у нас есть петля событий и очередь обратных вызовов.

Стек вызовов

JavaScript — однопоточный язык, и это значит — один стек вызовов. Иными словами, одна операция в один момент времени.

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

Давайте разберемся на примере. Посмотрите на код:

В начале выполнения стек пустой. После этого идут такие шаги:

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

В Chrome вы увидите такую картинку:

«Раздувание стека» — это то, что случается, когда стек увеличивается до его максимума. И это может произойти очень просто, особенно при использовании рекурсии без должного тестирования. Вот пример:

Когда движок исполняет этот код, он сперва вызывает функцию «foo». Эта функция рекурсивна, и постоянно вызывает саму себя без условия остановки. Так что на каждом шаге одна и та же функция добавляется в стек вызовов. Вот как это выглядит:

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

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

Одновременность и петля событий

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

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

И это не все проблемы. При большом стеке, заполненном функциями, браузер может надолго задуматься. Большинство браузеров вмешиваются, выбрасывая ошибку, спрашивая, не хотите ли вы остановить процесс на странице?

Не самый хороший UX, а?

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

Прим. переводчика: в оригинальной статье в конце идет ссылка на сервис SessionStack. Так как этот перевод объединяет две статьи, я помещу ссылку на сервис в конце. Кроме того, в конце статьи автор обещает рассказать про асинхронные обратные вызовы во второй статье цикла, но по факту этого не делает. Рассказ об асинхронных вызовах и петле событий — тема четвертой статьи, которую я переведу чуть позже.

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

Чуть выше мы разобрались с тем, как работает стек вызовов, и какие проблемы могут с ним быть у неопытных разработчиков. Теперь мы поговорим о движке V8. Движок JavaScript — программа, интерпретирующая код JS. Он может быть реализован как стандартный интерпретатор, или как JIT-компилятор байткода.

Вот список популярных реализаций движка JavaScript:

  • V8 — движок с открытым кодом, написанный на C++ Гуглом.
  • Rhino — разработка Mozilla Foundation, написан на Java, код открыт.
  • SpiderMonkey — первый движок JavaScript, который когда-то использовался в Netscape Navigator, и теперь используется в Firefox.
  • JavaScriptCore — движок, используемый в Safari, также известен как Nitro, разработка Apple с открытым кодом.
  • KJS — движок, разработанный Гарри Портеном для браузера Konqueror
  • Chakra(JScript9) — Internet Explorer.
  • Chakra(JavaScript) — Microsoft Edge.
  • Nashorn — часть проекта OpenJDK, разработка Oracle с открытым кодом.
  • JerryScript — легковесный движок для IoT.

Зачем был создан V8

Движок V8, созданный Гуглом — разработка с открытым исходным кодом на C++. Движок используется в Google Chrome. В отличие от остальных движков, V8 используется также как рантайм Node.JS.

Изначально V8 был создан для улучшения производительности JavaScript внутри браузеров. В целях производительности V8 транслирует JavaScript в более эффективный машинный код вместо интерпретации. Он компилирует код в байткод на лету, используя JIT, аналогично некоторым современным движкам вроде SpiderMonkey и Rhino. Основная разница в том, что V8 не перегоняет в байткод любой промежуточный код.

Компиляторы V8

До версии 5.9, выпущенной в апреле 2020 года, движок использовал два компилятора:

  • full-codegen, простой и очень быстрый компилятор, производящий простой и относительно медленный байткод.
  • Crankshaft — более сложный JIT–компилятор, производящий сильно оптимизированный байткод.

В V8 также используется несколько потоков выполнения:

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

При первом выполнении кода V8 использует full-codegen, который напрямую транслирует код в байткод без какой-либо оптимизации. Это позволяет запуститься очень быстро. Заметим, что V8 не использует промежуточный байткод, что позволяет обойтись без интерпретатора.

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

Наконец, в дело вступает Crankshaft в отдельном потоке. Он транслирует абстрактное синтаксическое дерево в SSA (static single-assignment representation), называемое Hydrogen, и пытается оптимизировать полученный граф. Большинство оптимизаций происходят на этом уровне.

Прим. переводчика: я не нашел адекватной и развернутой статьи по SSA на русском языке. Если у вас нет проблем с английским, взгляните на материал по SSA «Static Single Assignment Book», в противном случае придется ограничиться статьей в Википедии.

Встраивание

Первая оптимизация состоит в том, чтобы встроить как можно больше кода. Встраивание — процесс замены вызывающего кода на тело вызываемого метода. Этот шаг сильно облегчит последующие оптимизации.

Скрытый класс

JavaScript — прототипный язык, в нем нет классов и объектов, создаваемых клонированием. Кроме того, это динамический язык, так что свойства могут быть легко добавлены или удалены из объекта после его создания.

Большинство JavaScript–интерпретаторов используют структуры типа словарь, основанные на хеш-функциях, чтобы хранить свойства объектов в памяти. Такие структуры делают получение значений свойств более дорогим, чем в статических языках вроде Java или C#. В Java все свойства объектов определяются фиксированной схемой объекта (классом) до этапа компиляции, и эта схема не может быть изменена в процессе выполнения. В C# есть тип dynamic, но это тема отдельного разговора.

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

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

В силу того, что использование словарей для хранения свойств объектов в памяти очень неэффективно, V8 использует другой метод, называемый скрытыми классами. Они похожи на классы в языках типа Java, но создаются в процессе выполнения кода. Давайте посмотрим, как это выглядит.

Как только выполнение дойдет до строки «new Point(1, 2)», V8 создаст скрытый класс C0.

Пока у Point нет свойств, так что C0 пока пуст.

Как только первое выражение «this.x = x» выполнится внутри функции Point, V8 создаст второй скрытый класс C1, основанный на C0. С1 описывает то, где в памяти находится значение свойства x относительно указателя на объект. В нашем случае x сохранен по смещению 0, то есть при поиске в памяти объекта первое смещение будет соответствовать свойству x. Кроме того, V8 обновит класс C0 с помощью «классового перехода»: если к объекту Point добавится свойство x, следует опираться на скрытый класс C1. Нашему экземпляру объекта Point также соответствует класс C1.

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

Аналогичный процесс повторится на выражении «this.y = y».

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

Вы можете предположить, что для p1 и p2 будет использован один скрытый класс и один переход. Ну, не совсем. Для p1 сначала добавлено свойство a, потом b. Для p2, напротив, сначала b, потом a. Так что в итоге p1 и p2 будут использовать разные скрытые классы, и разные пути переходов. Будет разумно по возможности инициализировать динамические свойства в одном и том же порядке для переиспользования динамических классов.

Встроенное кеширование

V8 использует еще один подход для оптимизации динамически типизированных языков, известный как встроенное кеширование. Он основан на наблюдении повторных вызовов одного и того же метода для одного и того же типа объекта. Подробное объяснение принципов работы можно прочесть в материале «Optimizing dynamic JavaScript with inline caches». Мы рассмотрим общие принципы встроенного кеширования, на случай, если у вас нет времени читать подробный разбор.

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

Итак, как соотносятся концепции встроенного кеширования и скрытых классов? Когда метод вызывается для конкретного объекта, V8 ищет скрытый класс объекта, чтобы определить смещение нужного свойства. После двух успешных выполнений метода для того же скрытого класса движок пропускает все привычные операции и просто прибавляет смещение свойства к указателю на объект, сразу получая значение параметра. Для последующих вызовов V8 делает прямой вызов к памяти, удостоверившись предварительно, что скрытый класс не изменился. Это значительно ускоряет дело.

Встроенное кеширование — причина того, почему так важно разделять скрытые классы между объектами одного типа. Если для двух однотипных объектов будут использованы разные скрытые классы, V8 не сможет применить встроенное кеширование даже между двумя объектами одного типа, поскольку их разные скрытые классы будут иметь разное смещение для свойств.

Два объекта по сути эквивалентны, но их свойства созданы в разном порядке.

Компиляция в машинный код

Как только Hydrogen граф будет оптимизирован, Crankshaft преобразует его в низкоуровневое представление под названием Lithium. Большинство реализаций Lithium специфичны для конкретной архитектуры. Распределение регистров происходит на этом уровне.

В итоге Lithium компилируется в машинный код. Затем происходит операция под названием on-stack replacement, OSR. Прежде чем движок начнет компилировать и оптимизировать очевидно долгоиграющие методы, мы скорее всего уже запустим их. V8 не собирается забывать то, что он уже выполнял, и просто запустить оптимизированные версии. Вместо этого он трансформирует контекст, стек и регистры, так что мы можем переключиться на оптимизированную версию прямо в процессе выполнения. Это действительно сложная задача, учитывая то, что в числе прочих оптимизаций V8 уже встроил некоторое количество кода. Но V8 не единственный движок, способный на это.

Существует защитный механизм, называемый деоптимизацией. Он проводит обратное преобразование, возвращая обратно неоптимизированный код в случае, если движок ошибся с предположением.

Сборка мусора

Для сборки мусора V8 использует традиционный подход поколений и mark–and–sweep для очистки старого поколения. Фаза разметки предполагает приостановку выполнения кода. В целях контроля затрат на сборку и более плавной работы V8 использует постепенную разметку: вместо обхода всей кучи в попытках пометить каждый объект, он обходит часть кучи и продолжает нормальную работу. Следующая сборка начнется с места, где остановилась предыдущая. Это позволяет делать небольшие паузы в процессе работы. Как мы выяснили выше, фаза очистки происходит в отдельном потоке.

Ignition и TurboFan

Начиная с версии 5.9 в V8 появится новый подход к выполнению кода. Он обеспечит большую производительность и значительно меньший расход памяти на реальных задачах. Новый V8 построен поверх Ignition, интерпретатора V8 и TurboFan, нового оптимизирующего компилятора. Вы можете узнать больше об этом из поста в блоге разработчиков V8.

С версии 5.9 full-codegen и Crankshaft больше не будут использоваться в V8, а разработчики движка постараются реализовать новые возможности JavaScript и соответствующие оптимизации. Это значит, что в целом V8 получит более простую и поддерживаемую архитектуру.

Бенчмарк новой версии

Эти улучшения — только начало. Ignition и TurboFan проложат путь для дальнейших оптимизаций, которые увеличат производительность JavaScript и уменьшат размер движка в Chrome и Node.JS.

Прим. переводчика: статья не очень новая, так что на самом деле уже вышел V8 версии 6.0. Я просмотрел список изменений по диагонали, и не нашел ничего, что напрямую касается каких-то новых технологий компиляции и интерпретации.

Наконец, вот несколько советов, которые помогут вам писать хорошо оптимизированный JavaScript код. Вы не найдете ничего такого, чего бы мы не разобрали выше. Это просто обобщение уже известных вещей для вашего удобства:

  1. Порядок добавления свойств: объявляйте свойства в том же порядке для однотипных объектов, чтобы они переиспользовали одни и те же скрытые классы.
  2. Динамические свойства: добавление свойств к объекту во время выполнения заставляет движок построить новый скрытый класс и лишает все предыдущие скрытые классы уже готовой оптимизации. По возможности объявляйте все свойства в конструкторе.
  3. Методы: код, в котором один и тот же метод выполняется несколько раз подряд, быстрее того, где всегда выполняются разные методы. Причина — встроенное кеширование.
  4. Массивы: избегайте sparse-массивов, в которых ключи — не последовательные числа. Sparse-массивы, которые не содержат каждый элемент внутри — по сути хеш-таблицы. Доступ к элементам таких массивов обходится дороже. Кроме того, старайтесь не объявлять сразу большие массивы. Увеличение массивов по необходимости обойдется дешевле. И наконец, не удаляйте элементы из массивов, потому что это превратит их в sparse-массивы.
  5. Помеченные значения: V8 представляет объекты и целые числа 32-мя битами, и использует один бит для хранения типа: объект это (flag=1) или число (flag=0). Таким образом, целые числа представляются как SMI (SMall Integer), поскольку на самом деле занимают только 31 бит. Если число больше 31 бита, V8 упаковывает его, преобразуя в double, и создает новый объект, помещая число внутрь. Старайтесь укладывать знаковые целые числа в 31 бит, чтобы избежать больших расходов на упаковку-распаковку.
Топ-пост этого месяца:  OpenCart. Модуль вкладки для товара. Урок 1

Прим. переводчика: пятый пункт в оригинале звучит как «tagged values». Я не смог до конца понять, почему у этого пункта такое название, когда речь идет просто о накладных расходах на автоупаковку. Думаю, что в итоге это не помешает понять смысл совета.

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

Если вам интересно, у нас есть бесплатный тарифный план, чтобы можно было опробовать сервис.

Ресурсы

Это первые две из четырех статей цикла. Следующая статья — об устройстве памяти в JavaScript и борьбе с утечками памяти. Она выйдет в среду на этой неделе. Не переключайтесь!

JavaScript — самый популярный язык программирования в репозиториях Гитхаба. Любой фронтенд-разработчик имеет с ним дело, а Node.js активно используется в бэкенд-разработке. Но понимаете ли вы, как на самом деле устроен JavaScript?

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

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

Как работает JavaScript: движок, рантайм, стек вызовов

По мере роста популярности JavaScript команды разработчиков используют его на многих уровнях своих приложений: на веб-страницах, в бэкенде, гибридных приложениях, на мобильных устройствах. Как можно увидеть на Github Stats, JavaScript сейчас на первом месте рейтинга по количеству активных репозиториев и общему количеству пушей, и не сильно отстает в других категориях.

Прим. переводчика: вот актуальная статистика по языкам: madnight.github.io/githut

Если проекты становятся настолько зависимыми от JavaScript, это значит, что разработчики вынуждены лучше знакомиться с языком и углубляться в тонкости его реализации, чтобы продолжать делать хорошие приложения.

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

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

Если вы относительно недавно знакомы с JavaScript, этот пост поможет вам понять, почему JavaScript такой «странный» относительно других языков. А если вы уже опытный JavaScript–разработчик, я надеюсь, что статья покажет что-то новое о том, как работает язык, с которым вы работаете каждый день.

Движок JavaScript

Популярный пример движка JavaScript — это V8 от Google. Он используется, к примеру, внутри Chrome и Node.js. Вот сильно упрощенная модель того, как он выглядит изнутри:

Движок состоит из двух основных частей:

  • Куча — место, где происходит выделение памяти
  • Стек вызовов — место, где выполняется код, организованный в кадры вызовов

Среда выполнения

В браузере есть куча API, которыми пользуется почти каждый разработчик, например setTimeout. Эти API, однако, не предоставляются движком. Так откуда они берутся? Оказывается, что реальность несколько сложнее.

Итак, у нас есть движок, но кроме этого еще куча всего. У нас есть эти штуки, которые мы называем Web API, предоставляемые браузером, всякие DOM, AJAX, setTimeout и еще много всего. И еще у нас есть петля событий и очередь обратных вызовов.

Стек вызовов

JavaScript — однопоточный язык, и это значит — один стек вызовов. Иными словами, одна операция в один момент времени.

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

Давайте разберемся на примере. Посмотрите на код:

В начале выполнения стек пустой. После этого идут такие шаги:

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

В Chrome вы увидите такую картинку:

«Раздувание стека» — это то, что случается, когда стек увеличивается до его максимума. И это может произойти очень просто, особенно при использовании рекурсии без должного тестирования. Вот пример:

Когда движок исполняет этот код, он сперва вызывает функцию «foo». Эта функция рекурсивна, и постоянно вызывает саму себя без условия остановки. Так что на каждом шаге одна и та же функция добавляется в стек вызовов. Вот как это выглядит:

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

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

Одновременность и петля событий

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

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

И это не все проблемы. При большом стеке, заполненном функциями, браузер может надолго задуматься. Большинство браузеров вмешиваются, выбрасывая ошибку, спрашивая, не хотите ли вы остановить процесс на странице?

Не самый хороший UX, а?

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

Прим. переводчика: в оригинальной статье в конце идет ссылка на сервис SessionStack. Так как этот перевод объединяет две статьи, я помещу ссылку на сервис в конце. Кроме того, в конце статьи автор обещает рассказать про асинхронные обратные вызовы во второй статье цикла, но по факту этого не делает. Рассказ об асинхронных вызовах и петле событий — тема четвертой статьи, которую я переведу чуть позже.

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

Чуть выше мы разобрались с тем, как работает стек вызовов, и какие проблемы могут с ним быть у неопытных разработчиков. Теперь мы поговорим о движке V8. Движок JavaScript — программа, интерпретирующая код JS. Он может быть реализован как стандартный интерпретатор, или как JIT-компилятор байткода.

Вот список популярных реализаций движка JavaScript:

  • V8 — движок с открытым кодом, написанный на C++ Гуглом.
  • Rhino — разработка Mozilla Foundation, написан на Java, код открыт.
  • SpiderMonkey — первый движок JavaScript, который когда-то использовался в Netscape Navigator, и теперь используется в Firefox.
  • JavaScriptCore — движок, используемый в Safari, также известен как Nitro, разработка Apple с открытым кодом.
  • KJS — движок, разработанный Гарри Портеном для браузера Konqueror
  • Chakra(JScript9) — Internet Explorer.
  • Chakra(JavaScript) — Microsoft Edge.
  • Nashorn — часть проекта OpenJDK, разработка Oracle с открытым кодом.
  • JerryScript — легковесный движок для IoT.

Зачем был создан V8

Движок V8, созданный Гуглом — разработка с открытым исходным кодом на C++. Движок используется в Google Chrome. В отличие от остальных движков, V8 используется также как рантайм Node.JS.

Изначально V8 был создан для улучшения производительности JavaScript внутри браузеров. В целях производительности V8 транслирует JavaScript в более эффективный машинный код вместо интерпретации. Он компилирует код в байткод на лету, используя JIT, аналогично некоторым современным движкам вроде SpiderMonkey и Rhino. Основная разница в том, что V8 не перегоняет в байткод любой промежуточный код.

Компиляторы V8

До версии 5.9, выпущенной в апреле 2020 года, движок использовал два компилятора:

  • full-codegen, простой и очень быстрый компилятор, производящий простой и относительно медленный байткод.
  • Crankshaft — более сложный JIT–компилятор, производящий сильно оптимизированный байткод.

В V8 также используется несколько потоков выполнения:

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

При первом выполнении кода V8 использует full-codegen, который напрямую транслирует код в байткод без какой-либо оптимизации. Это позволяет запуститься очень быстро. Заметим, что V8 не использует промежуточный байткод, что позволяет обойтись без интерпретатора.

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

Наконец, в дело вступает Crankshaft в отдельном потоке. Он транслирует абстрактное синтаксическое дерево в SSA (static single-assignment representation), называемое Hydrogen, и пытается оптимизировать полученный граф. Большинство оптимизаций происходят на этом уровне.

Прим. переводчика: я не нашел адекватной и развернутой статьи по SSA на русском языке. Если у вас нет проблем с английским, взгляните на материал по SSA «Static Single Assignment Book», в противном случае придется ограничиться статьей в Википедии.

Встраивание

Первая оптимизация состоит в том, чтобы встроить как можно больше кода. Встраивание — процесс замены вызывающего кода на тело вызываемого метода. Этот шаг сильно облегчит последующие оптимизации.

Скрытый класс

JavaScript — прототипный язык, в нем нет классов и объектов, создаваемых клонированием. Кроме того, это динамический язык, так что свойства могут быть легко добавлены или удалены из объекта после его создания.

Большинство JavaScript–интерпретаторов используют структуры типа словарь, основанные на хеш-функциях, чтобы хранить свойства объектов в памяти. Такие структуры делают получение значений свойств более дорогим, чем в статических языках вроде Java или C#. В Java все свойства объектов определяются фиксированной схемой объекта (классом) до этапа компиляции, и эта схема не может быть изменена в процессе выполнения. В C# есть тип dynamic, но это тема отдельного разговора.

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

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

В силу того, что использование словарей для хранения свойств объектов в памяти очень неэффективно, V8 использует другой метод, называемый скрытыми классами. Они похожи на классы в языках типа Java, но создаются в процессе выполнения кода. Давайте посмотрим, как это выглядит.

Как только выполнение дойдет до строки «new Point(1, 2)», V8 создаст скрытый класс C0.

Пока у Point нет свойств, так что C0 пока пуст.

Как только первое выражение «this.x = x» выполнится внутри функции Point, V8 создаст второй скрытый класс C1, основанный на C0. С1 описывает то, где в памяти находится значение свойства x относительно указателя на объект. В нашем случае x сохранен по смещению 0, то есть при поиске в памяти объекта первое смещение будет соответствовать свойству x. Кроме того, V8 обновит класс C0 с помощью «классового перехода»: если к объекту Point добавится свойство x, следует опираться на скрытый класс C1. Нашему экземпляру объекта Point также соответствует класс C1.

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

Аналогичный процесс повторится на выражении «this.y = y».

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

Вы можете предположить, что для p1 и p2 будет использован один скрытый класс и один переход. Ну, не совсем. Для p1 сначала добавлено свойство a, потом b. Для p2, напротив, сначала b, потом a. Так что в итоге p1 и p2 будут использовать разные скрытые классы, и разные пути переходов. Будет разумно по возможности инициализировать динамические свойства в одном и том же порядке для переиспользования динамических классов.

Встроенное кеширование

V8 использует еще один подход для оптимизации динамически типизированных языков, известный как встроенное кеширование. Он основан на наблюдении повторных вызовов одного и того же метода для одного и того же типа объекта. Подробное объяснение принципов работы можно прочесть в материале «Optimizing dynamic JavaScript with inline caches». Мы рассмотрим общие принципы встроенного кеширования, на случай, если у вас нет времени читать подробный разбор.

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

Итак, как соотносятся концепции встроенного кеширования и скрытых классов? Когда метод вызывается для конкретного объекта, V8 ищет скрытый класс объекта, чтобы определить смещение нужного свойства. После двух успешных выполнений метода для того же скрытого класса движок пропускает все привычные операции и просто прибавляет смещение свойства к указателю на объект, сразу получая значение параметра. Для последующих вызовов V8 делает прямой вызов к памяти, удостоверившись предварительно, что скрытый класс не изменился. Это значительно ускоряет дело.

Встроенное кеширование — причина того, почему так важно разделять скрытые классы между объектами одного типа. Если для двух однотипных объектов будут использованы разные скрытые классы, V8 не сможет применить встроенное кеширование даже между двумя объектами одного типа, поскольку их разные скрытые классы будут иметь разное смещение для свойств.

Два объекта по сути эквивалентны, но их свойства созданы в разном порядке.

Компиляция в машинный код

Как только Hydrogen граф будет оптимизирован, Crankshaft преобразует его в низкоуровневое представление под названием Lithium. Большинство реализаций Lithium специфичны для конкретной архитектуры. Распределение регистров происходит на этом уровне.

В итоге Lithium компилируется в машинный код. Затем происходит операция под названием on-stack replacement, OSR. Прежде чем движок начнет компилировать и оптимизировать очевидно долгоиграющие методы, мы скорее всего уже запустим их. V8 не собирается забывать то, что он уже выполнял, и просто запустить оптимизированные версии. Вместо этого он трансформирует контекст, стек и регистры, так что мы можем переключиться на оптимизированную версию прямо в процессе выполнения. Это действительно сложная задача, учитывая то, что в числе прочих оптимизаций V8 уже встроил некоторое количество кода. Но V8 не единственный движок, способный на это.

Существует защитный механизм, называемый деоптимизацией. Он проводит обратное преобразование, возвращая обратно неоптимизированный код в случае, если движок ошибся с предположением.

Сборка мусора

Для сборки мусора V8 использует традиционный подход поколений и mark–and–sweep для очистки старого поколения. Фаза разметки предполагает приостановку выполнения кода. В целях контроля затрат на сборку и более плавной работы V8 использует постепенную разметку: вместо обхода всей кучи в попытках пометить каждый объект, он обходит часть кучи и продолжает нормальную работу. Следующая сборка начнется с места, где остановилась предыдущая. Это позволяет делать небольшие паузы в процессе работы. Как мы выяснили выше, фаза очистки происходит в отдельном потоке.

Ignition и TurboFan

Начиная с версии 5.9 в V8 появится новый подход к выполнению кода. Он обеспечит большую производительность и значительно меньший расход памяти на реальных задачах. Новый V8 построен поверх Ignition, интерпретатора V8 и TurboFan, нового оптимизирующего компилятора. Вы можете узнать больше об этом из поста в блоге разработчиков V8.

С версии 5.9 full-codegen и Crankshaft больше не будут использоваться в V8, а разработчики движка постараются реализовать новые возможности JavaScript и соответствующие оптимизации. Это значит, что в целом V8 получит более простую и поддерживаемую архитектуру.

Бенчмарк новой версии

Эти улучшения — только начало. Ignition и TurboFan проложат путь для дальнейших оптимизаций, которые увеличат производительность JavaScript и уменьшат размер движка в Chrome и Node.JS.

Прим. переводчика: статья не очень новая, так что на самом деле уже вышел V8 версии 6.0. Я просмотрел список изменений по диагонали, и не нашел ничего, что напрямую касается каких-то новых технологий компиляции и интерпретации.

Наконец, вот несколько советов, которые помогут вам писать хорошо оптимизированный JavaScript код. Вы не найдете ничего такого, чего бы мы не разобрали выше. Это просто обобщение уже известных вещей для вашего удобства:

  1. Порядок добавления свойств: объявляйте свойства в том же порядке для однотипных объектов, чтобы они переиспользовали одни и те же скрытые классы.
  2. Динамические свойства: добавление свойств к объекту во время выполнения заставляет движок построить новый скрытый класс и лишает все предыдущие скрытые классы уже готовой оптимизации. По возможности объявляйте все свойства в конструкторе.
  3. Методы: код, в котором один и тот же метод выполняется несколько раз подряд, быстрее того, где всегда выполняются разные методы. Причина — встроенное кеширование.
  4. Массивы: избегайте sparse-массивов, в которых ключи — не последовательные числа. Sparse-массивы, которые не содержат каждый элемент внутри — по сути хеш-таблицы. Доступ к элементам таких массивов обходится дороже. Кроме того, старайтесь не объявлять сразу большие массивы. Увеличение массивов по необходимости обойдется дешевле. И наконец, не удаляйте элементы из массивов, потому что это превратит их в sparse-массивы.
  5. Помеченные значения: V8 представляет объекты и целые числа 32-мя битами, и использует один бит для хранения типа: объект это (flag=1) или число (flag=0). Таким образом, целые числа представляются как SMI (SMall Integer), поскольку на самом деле занимают только 31 бит. Если число больше 31 бита, V8 упаковывает его, преобразуя в double, и создает новый объект, помещая число внутрь. Старайтесь укладывать знаковые целые числа в 31 бит, чтобы избежать больших расходов на упаковку-распаковку.

Прим. переводчика: пятый пункт в оригинале звучит как «tagged values». Я не смог до конца понять, почему у этого пункта такое название, когда речь идет просто о накладных расходах на автоупаковку. Думаю, что в итоге это не помешает понять смысл совета.

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

Если вам интересно, у нас есть бесплатный тарифный план, чтобы можно было опробовать сервис.

Ресурсы

Это первые две из четырех статей цикла. Следующая статья — об устройстве памяти в JavaScript и борьбе с утечками памяти. Она выйдет в среду на этой неделе. Не переключайтесь!

Добавить комментарий