Как работает JavaScriptCore под капотом?
Последнее время, все больше мое внимание занимает движок JavaScriptCore. Для тех кто не знаком, JSC - это движок, который используется в Safari под капотом и на всех iPhone для выполнения JavaScript кода. Но не спешите думать, что раз Safari, значит всё плохо. Напротив, это лучшее, что есть в WebKit. А что, если я вам скажу, что он быстрее V8?
Каждый JS код, который мы исполняем с JSC проходит 3 стадии (рис. 1):
1. Лексический анализ (parser/Lexer.cpp).
Здесь происходит разбивка кода на токены. Разбивка происходит по заранее определенным символам: таким как ключевые слова, операции, имена переменных и т.д.
2. Парсинг (parser/JSParser.cpp).
Парсер выстраивает абстрактное синтаксическое дерево (AST) на основе полученной от лексера разбивки на токены. Например, для выражения «a+b» будет построено дерево, где “+” - операция (родитель), а «а» и «b» - его листья.
3. LLInt (Low-level interpreter)
На этом этапе полученное AST интерпретируется в байт-код, который JSC может исполнить, используя процессор. Например, выражение «a+b» будет преобразовано в байт-код вида:
Четыре уровня оптимизации JSC
1. LLInt - низкоуровневый интерпретатор, как упоминалось ранее, который компилирует JS инструкции в байт-код.
2. Baseline JIT* (500 итераций) - на этом этапе фрагмент кода, который исполнился 500 раз преобразуется в машинный код на основе шаблонов. Никакой дополнительной логики относительно связи с другими инструкциями, только готовые шаблоны.
3. Data Flow Graph (DFG) JIT (1000 итераций) - имеет промежуточное представление, которое преобразует JS инструкции в граф потока данных. После чего JIT-компилятор DFG может выполнять сложную оптимизацию, связанную с потоком кода. В приложении (рис. 2) проиллюстрировано промежуточное представление DFG на примере простой функции:
4. Faster than Light (FTL) JIT (100 000 итераций) - в отличии от JIT-компилятора DFG, компилятор FTL фокусируется на оптимизации вне зависимости от того, на сколько дорогостоящей она может быть. FTL переиспользует оптимизацию DFG и добавляет еще большие улучшения.
* JIT - Just In Time компилятор, то есть компиляция во время исполнения. Противоположность AOT, где компиляция происходит до запуска программы, например, в C/С++ (рис. 3).
Последнее время, все больше мое внимание занимает движок JavaScriptCore. Для тех кто не знаком, JSC - это движок, который используется в Safari под капотом и на всех iPhone для выполнения JavaScript кода. Но не спешите думать, что раз Safari, значит всё плохо. Напротив, это лучшее, что есть в WebKit. А что, если я вам скажу, что он быстрее V8?
Каждый JS код, который мы исполняем с JSC проходит 3 стадии (рис. 1):
1. Лексический анализ (parser/Lexer.cpp).
Здесь происходит разбивка кода на токены. Разбивка происходит по заранее определенным символам: таким как ключевые слова, операции, имена переменных и т.д.
2. Парсинг (parser/JSParser.cpp).
Парсер выстраивает абстрактное синтаксическое дерево (AST) на основе полученной от лексера разбивки на токены. Например, для выражения «a+b» будет построено дерево, где “+” - операция (родитель), а «а» и «b» - его листья.
3. LLInt (Low-level interpreter)
На этом этапе полученное AST интерпретируется в байт-код, который JSC может исполнить, используя процессор. Например, выражение «a+b» будет преобразовано в байт-код вида:
add loc3, loc1, loc2, OperandTypes(126, 126). Оно складывает loc1 и loc2, и сохраняет в переменную loc3.Четыре уровня оптимизации JSC
1. LLInt - низкоуровневый интерпретатор, как упоминалось ранее, который компилирует JS инструкции в байт-код.
2. Baseline JIT* (500 итераций) - на этом этапе фрагмент кода, который исполнился 500 раз преобразуется в машинный код на основе шаблонов. Никакой дополнительной логики относительно связи с другими инструкциями, только готовые шаблоны.
3. Data Flow Graph (DFG) JIT (1000 итераций) - имеет промежуточное представление, которое преобразует JS инструкции в граф потока данных. После чего JIT-компилятор DFG может выполнять сложную оптимизацию, связанную с потоком кода. В приложении (рис. 2) проиллюстрировано промежуточное представление DFG на примере простой функции:
function Foo(arg) {
return this.y * arg[0];
}4. Faster than Light (FTL) JIT (100 000 итераций) - в отличии от JIT-компилятора DFG, компилятор FTL фокусируется на оптимизации вне зависимости от того, на сколько дорогостоящей она может быть. FTL переиспользует оптимизацию DFG и добавляет еще большие улучшения.
* JIT - Just In Time компилятор, то есть компиляция во время исполнения. Противоположность AOT, где компиляция происходит до запуска программы, например, в C/С++ (рис. 3).
Постановка целей - метод A/Б
Время чтения: ~2 минуты
Вы наверняка слышали о методике SMART для постановки целей, что означает, что цель должна быть: конкретная, измеримая, достижимая, значимая и ограниченная во времени. Я не буду останавливаться на этом, по сколько считаю, что данная методика вам уже известна. Кто слышит о SMART впервые, можете подробнее ознакомиться с ней в этой статье. Я же вас научу этим правильно пользоваться.
Метод A/Б
Вам необходимо отметить и зафиксировать две точки.
Точка А - то, где вы и ваша жизнь находится в данный момент. Здесь вы выписываете последствия того, что будет если вы прекратите двигаться вперёд и на всю жизнь останетесь в этом состоянии.
Точка Б - то, что является вашей целью, что, в случае успеха, положительно повлияет на вашу жизнь. Здесь выпишите то, что вам даст достижение этой цели, какой потенциал это в себе несёт.
Цель должна быть сформулирована по SMART, то есть должна быть конкретна, реальна, измерима и иметь дедлайн. При том измеримость должна быть не в том, чтобы заработать 100тыс. рублей, а в том, чтобы сделать 10 проектов. По сколько это должно быть в области вашего влияния на 100%. Вы не можете прямо влиять на то купят у вас товар или услугу, это зависит не только от вас. Зато от вас зависит сделаете ли вы 10 проектов, решите ли вы 100 задач. Сконцентрируйтесь не на ожидаемом результате, а на ваших действиях, которые потенциально ведут вас к лучшему будущему. Дедлайн для вашей цели должен быть краткосрочный - 1-2 месяца, для получения наискорейшей отдачи и результата.
Пример постановки цели по A/Б
Цель - решить 100 задач leetcode уровня easy/medium за 1 месяц.
Точка А - разнорабочий, нестабильный доход, достаточно нервная работа. Мало свободного времени, ипотека неподъёмная. Текущих навыков JS не хватает, чтобы изменить профессию.
Точка Б - решив 100 задач, навык программирования увеличится в разы. Я смогу с легкостью решить любую задачу на собеседовании. Также это даст мне лучшее понимание работы javascript и опыт написания кода. Потенциально, с этим навыком, я смогу сменить сферу деятельности на frontend и уже продолжить развиваться имея стабильный доход и удаленную работу. Это решит мои финансовые вопросы, я смогу путешествовать и посетить все места, которые хочу.
По итогу, мы имеем конкретный план: решать по 3-4 задачи в день. Ограниченность по времени будет держать в тонусе, а нежелание оставаться в точке А на всю жизнь будет лучше любого мотиватора помогать нам двигаться к цели.
Самое главное в целеполагании от А к Б то, что при достижении точки Б, мы выходим на следующий виток спирали, где эта точка для нас становится новой точкой А. Познав вкус победы из А в Б, вы захотите еще и еще, и вот вас уже не остановить.
Возьмите прямо сейчас лист бумаги и запишите ваш путь из А → Б. Главное, ставьте реальные, измеримые цели, на которые можете влиять. Проводите ревью результатов по итогам месяца и продолжайте двигаться к вашим глобальным целям.
Надеюсь, этот способ целеполагания откликнется и в вас, что поможет сделать вашу жизнь понятнее, а значит проще.
Накидайте огонька, если полезно 🔥
Время чтения: ~2 минуты
Вы наверняка слышали о методике SMART для постановки целей, что означает, что цель должна быть: конкретная, измеримая, достижимая, значимая и ограниченная во времени. Я не буду останавливаться на этом, по сколько считаю, что данная методика вам уже известна. Кто слышит о SMART впервые, можете подробнее ознакомиться с ней в этой статье. Я же вас научу этим правильно пользоваться.
Метод A/Б
Вам необходимо отметить и зафиксировать две точки.
Точка А - то, где вы и ваша жизнь находится в данный момент. Здесь вы выписываете последствия того, что будет если вы прекратите двигаться вперёд и на всю жизнь останетесь в этом состоянии.
Точка Б - то, что является вашей целью, что, в случае успеха, положительно повлияет на вашу жизнь. Здесь выпишите то, что вам даст достижение этой цели, какой потенциал это в себе несёт.
Цель должна быть сформулирована по SMART, то есть должна быть конкретна, реальна, измерима и иметь дедлайн. При том измеримость должна быть не в том, чтобы заработать 100тыс. рублей, а в том, чтобы сделать 10 проектов. По сколько это должно быть в области вашего влияния на 100%. Вы не можете прямо влиять на то купят у вас товар или услугу, это зависит не только от вас. Зато от вас зависит сделаете ли вы 10 проектов, решите ли вы 100 задач. Сконцентрируйтесь не на ожидаемом результате, а на ваших действиях, которые потенциально ведут вас к лучшему будущему. Дедлайн для вашей цели должен быть краткосрочный - 1-2 месяца, для получения наискорейшей отдачи и результата.
Пример постановки цели по A/Б
Цель - решить 100 задач leetcode уровня easy/medium за 1 месяц.
Точка А - разнорабочий, нестабильный доход, достаточно нервная работа. Мало свободного времени, ипотека неподъёмная. Текущих навыков JS не хватает, чтобы изменить профессию.
Точка Б - решив 100 задач, навык программирования увеличится в разы. Я смогу с легкостью решить любую задачу на собеседовании. Также это даст мне лучшее понимание работы javascript и опыт написания кода. Потенциально, с этим навыком, я смогу сменить сферу деятельности на frontend и уже продолжить развиваться имея стабильный доход и удаленную работу. Это решит мои финансовые вопросы, я смогу путешествовать и посетить все места, которые хочу.
По итогу, мы имеем конкретный план: решать по 3-4 задачи в день. Ограниченность по времени будет держать в тонусе, а нежелание оставаться в точке А на всю жизнь будет лучше любого мотиватора помогать нам двигаться к цели.
Самое главное в целеполагании от А к Б то, что при достижении точки Б, мы выходим на следующий виток спирали, где эта точка для нас становится новой точкой А. Познав вкус победы из А в Б, вы захотите еще и еще, и вот вас уже не остановить.
Возьмите прямо сейчас лист бумаги и запишите ваш путь из А → Б. Главное, ставьте реальные, измеримые цели, на которые можете влиять. Проводите ревью результатов по итогам месяца и продолжайте двигаться к вашим глобальным целям.
Надеюсь, этот способ целеполагания откликнется и в вас, что поможет сделать вашу жизнь понятнее, а значит проще.
Накидайте огонька, если полезно 🔥
С завода во Frontend. Вопросы для подкаста 💬
Привет всем! Мы готовимся к необычному для канала формату - интервью. Наш герой - это обычный парень, который смог уйти с завода, и построить карьеру в мире frontend-разработки!
Он столкнулся с немалым количеством препятствий, отказов и трудностей, точно так же, как и многие из вас, кто сейчас находится на этом пути. Но благодаря своему стремлению, упорству и желанию учиться, он не только достиг своей цели в 2022г, но уже сейчас работает в одной из ведущих компаний.
Я верю, что его история станет отличным источником мотивации для каждого, кто стоит на этом же пути, и с нетерпением жду ваших вопросов! Вопросы помогут сделать интервью максимально полезным и интересным.
Пишите, спрашивайте, делитесь своими мыслями - так мы сделаем этот подкаст по-настоящему полезным и вдохновляющим! 👨💻👨💻
Привет всем! Мы готовимся к необычному для канала формату - интервью. Наш герой - это обычный парень, который смог уйти с завода, и построить карьеру в мире frontend-разработки!
Он столкнулся с немалым количеством препятствий, отказов и трудностей, точно так же, как и многие из вас, кто сейчас находится на этом пути. Но благодаря своему стремлению, упорству и желанию учиться, он не только достиг своей цели в 2022г, но уже сейчас работает в одной из ведущих компаний.
Я верю, что его история станет отличным источником мотивации для каждого, кто стоит на этом же пути, и с нетерпением жду ваших вопросов! Вопросы помогут сделать интервью максимально полезным и интересным.
Пишите, спрашивайте, делитесь своими мыслями - так мы сделаем этот подкаст по-настоящему полезным и вдохновляющим! 👨💻👨💻
Node быстрее Bun?
Гоняю бенчмарки для сравнения Node.js vs Bun, смотрите какую любопытную картину получил.
📌 index.js - файл с высокой вычислительной нагрузкой: поиск простых чисел до 100 000, вычисления факториалов чисел от 0 до 20, генерация случайных чисел с последующей их обработкой, а также сортировка массива.
📌 console.js - файл с console.log('hello'), как в большинстве статей в интернете.
Тестовая среда: Windows WSL (Ubuntu). Node.js v22.3.0, Bun v1.1.13
По итогу прогона утилитой hyperfine имеем:
index.js:
• bun = 187.1ms
• node.js = 161.4ms
console.js:
• bun = 6.6ms
• node.js = 10.1ms
При большой вычислительной нагрузке Node.js быстрее Bun. Что это выходит, авторы Bun нам откровенно лгут, ссылаясь на прогоны простых скриптов? Расследование только началось - а результаты уже превзошли ожидания. Продолжу изучать этот вопрос с интересом, о результатах буду держать вас в курсе в этом канале.
Сергей Константинов | IT и не только. Подписаться!
Гоняю бенчмарки для сравнения Node.js vs Bun, смотрите какую любопытную картину получил.
Тестовая среда: Windows WSL (Ubuntu). Node.js v22.3.0, Bun v1.1.13
По итогу прогона утилитой hyperfine имеем:
index.js:
• bun = 187.1ms
• node.js = 161.4ms
console.js:
• bun = 6.6ms
• node.js = 10.1ms
При большой вычислительной нагрузке Node.js быстрее Bun. Что это выходит, авторы Bun нам откровенно лгут, ссылаясь на прогоны простых скриптов? Расследование только началось - а результаты уже превзошли ожидания. Продолжу изучать этот вопрос с интересом, о результатах буду держать вас в курсе в этом канале.
Сергей Константинов | IT и не только. Подписаться!
Please open Telegram to view this post
VIEW IN TELEGRAM
Популярная ошибка при решении задач на интервью
Самая частая ошибка - начинать писать код сразу, как вы получили условие. На данный момент у вас нет готового решения, и вы надеетесь придумать его, поэтапно выражая мысли в код. Часто это заканчивается тем, что вы встаете в тупик, стираете весь написанный код и начинаете писать заново, впустую потратив время.
Как решать задачи правильно?
1. Сперва, после прочтения условия, убедитесь, что вы поняли его верно. Предположите, какие могут быть краевые условия. Например, поведение программы при пустом массиве, нуле или бесконечности. Уточните у интервьюера корректность понимания работы программы в этих условиях. Обговорите, какой тип данных принимает функция, всегда ли это что-то одно или тип может быть любой? Работает ли программа с отрицательными числами? И так далее. Все индивидуально от конкретной задачи.
2. Полностью продумайте алгоритм решения в голове. Его также можно обговорить с интервьюером. Скорее всего уже на этом этапе у вас может завестись обсуждение вида: «а что, если вот так?». Как следствие, вы сможете сразу внести коррективы в решение. После чего приступайте к написанию кода.
3. После того, как решение задачи реализовано, не спешите его запускать. Пробегитесь построчно, как интерпретатор по вашему коду, исполните его в своей голове, убедитесь, что код работает верно. Не пренебрегайте лишней проверкой со своей стороны. Моя частая ошибка была в том, что я забывал написать return в конце верного решения, что зачастую мне срезало баллы.
В основном, собеседующему важно понимать, как вы мыслите и не так важно, чтобы ваша программа запустилась с первого раза. Однако, ряд компаний имеет иные приоритеты, поэтому относитесь внимательно к самопроверке.
Всем оптимальных алгоритмов!
Сергей Константинов | IT и не только. Подписаться!
Самая частая ошибка - начинать писать код сразу, как вы получили условие. На данный момент у вас нет готового решения, и вы надеетесь придумать его, поэтапно выражая мысли в код. Часто это заканчивается тем, что вы встаете в тупик, стираете весь написанный код и начинаете писать заново, впустую потратив время.
Как решать задачи правильно?
1. Сперва, после прочтения условия, убедитесь, что вы поняли его верно. Предположите, какие могут быть краевые условия. Например, поведение программы при пустом массиве, нуле или бесконечности. Уточните у интервьюера корректность понимания работы программы в этих условиях. Обговорите, какой тип данных принимает функция, всегда ли это что-то одно или тип может быть любой? Работает ли программа с отрицательными числами? И так далее. Все индивидуально от конкретной задачи.
2. Полностью продумайте алгоритм решения в голове. Его также можно обговорить с интервьюером. Скорее всего уже на этом этапе у вас может завестись обсуждение вида: «а что, если вот так?». Как следствие, вы сможете сразу внести коррективы в решение. После чего приступайте к написанию кода.
3. После того, как решение задачи реализовано, не спешите его запускать. Пробегитесь построчно, как интерпретатор по вашему коду, исполните его в своей голове, убедитесь, что код работает верно. Не пренебрегайте лишней проверкой со своей стороны. Моя частая ошибка была в том, что я забывал написать return в конце верного решения, что зачастую мне срезало баллы.
В основном, собеседующему важно понимать, как вы мыслите и не так важно, чтобы ваша программа запустилась с первого раза. Однако, ряд компаний имеет иные приоритеты, поэтому относитесь внимательно к самопроверке.
Всем оптимальных алгоритмов!
Сергей Константинов | IT и не только. Подписаться!
Алтай
Отдохнул на Алтае. Группа великолепная, команда сопровождения - огнище, тур - пушка ракета 🚀
Ментально и физически оздоровился, впечатлениями зарядился, на конях покатался. Теперь можно работать!
Было время, когда работал 4 года без отпусков, сейчас стараюсь находить время для таких путешествий. Рекомендую 🔥
А вы часто путешествуете?
Отдохнул на Алтае. Группа великолепная, команда сопровождения - огнище, тур - пушка ракета 🚀
Ментально и физически оздоровился, впечатлениями зарядился, на конях покатался. Теперь можно работать!
Было время, когда работал 4 года без отпусков, сейчас стараюсь находить время для таких путешествий. Рекомендую 🔥
А вы часто путешествуете?
Обход блокировки YouTube 📱
Недавняя блокировка YouTube подставила под сомнение использование платформы и ведение канала, однако быстро нашлось решение.
Проблема заключается в том, что во время установки SSL соединения, домен, к которому мы подключаемся, передается в открытом виде. И если это googlevideo.com то начинают твориться "интересные вещи". Подробнее об этом, а также об обходе блокировки на уровне роутера для всей сети можно почитать в статье на хабре.
Однако, я предложу более простое решение, которое работает на Windows для вашего компьютера.
1. Скачайте последнюю версию, распакуйте архив (goodbyedpi-0.2.3rc1-2.zip)
2. Запустите 1_russia_blacklist.cmd
Подробнее о вопросах относительно софта читайте в обсуждении на github.
Имейте ввиду, это скрипт, который работает только лишь во время, когда он запущен. Чтобы удалить программу достаточно завершить процесс.
Надеюсь, что данный пост был вам полезен и сделает вашу жизнь немного комфортнее :)
UPD. Решения для всех систем: MacOS, Windows, Linux смотри в треде к этому посту
Сергей Константинов | IT и не только. Подписаться!
Недавняя блокировка YouTube подставила под сомнение использование платформы и ведение канала, однако быстро нашлось решение.
Проблема заключается в том, что во время установки SSL соединения, домен, к которому мы подключаемся, передается в открытом виде. И если это googlevideo.com то начинают твориться "интересные вещи". Подробнее об этом, а также об обходе блокировки на уровне роутера для всей сети можно почитать в статье на хабре.
Однако, я предложу более простое решение, которое работает на Windows для вашего компьютера.
1. Скачайте последнюю версию, распакуйте архив (goodbyedpi-0.2.3rc1-2.zip)
2. Запустите 1_russia_blacklist.cmd
Подробнее о вопросах относительно софта читайте в обсуждении на github.
Имейте ввиду, это скрипт, который работает только лишь во время, когда он запущен. Чтобы удалить программу достаточно завершить процесс.
Надеюсь, что данный пост был вам полезен и сделает вашу жизнь немного комфортнее :)
UPD. Решения для всех систем: MacOS, Windows, Linux смотри в треде к этому посту
Сергей Константинов | IT и не только. Подписаться!
Please open Telegram to view this post
VIEW IN TELEGRAM
Bun vs Node: Bundler
Продолжаю готовиться к конференции и гоняю бенчмарки. В этот раз дело дошло до сборщиков. Спасибо Зару Захарову за предоставленные бенчмарки. Я их расширил добавив Bun в качестве сборщика.
Бенчмарк представляет собой сборку 1000 react typescript компонентов, здесь можно посмотреть исходный код.
Результат меня поразил.
В таблице вы можете видеть сравнение всех сборщиков: bun, vite, next, webpack, parcel. А также их зависимость от запусков с помощью
Bun собирает проект за невероятные сотые доли секунды. Всего 0.072 сек. потребовалось bun, чтобы собрать проект. Напротив, webpack собирает за 12.8 сек., а самое быстрое до сего момента решение vite - за 3.01 сек. Самый медленный оказался parcel с 14.53 сек.
Предполагаю, что краеугольным камнем всех сборщиков стал typescript. Возможность bun'a обрабатывать TS сразу под капотом дало ему невероятное ускорение.
Есть ли у вас идеи, как мы можем составить конкуренцию Bun в этом бенчмарке?
Продолжаю готовиться к конференции и гоняю бенчмарки. В этот раз дело дошло до сборщиков. Спасибо Зару Захарову за предоставленные бенчмарки. Я их расширил добавив Bun в качестве сборщика.
Бенчмарк представляет собой сборку 1000 react typescript компонентов, здесь можно посмотреть исходный код.
Результат меня поразил.
В таблице вы можете видеть сравнение всех сборщиков: bun, vite, next, webpack, parcel. А также их зависимость от запусков с помощью
npm run build и bun run build.Bun собирает проект за невероятные сотые доли секунды. Всего 0.072 сек. потребовалось bun, чтобы собрать проект. Напротив, webpack собирает за 12.8 сек., а самое быстрое до сего момента решение vite - за 3.01 сек. Самый медленный оказался parcel с 14.53 сек.
Предполагаю, что краеугольным камнем всех сборщиков стал typescript. Возможность bun'a обрабатывать TS сразу под капотом дало ему невероятное ускорение.
Есть ли у вас идеи, как мы можем составить конкуренцию Bun в этом бенчмарке?
Forwarded from FrontendConf конференция
Будущее фронтенд-разработки
В мире технологий изменения происходят быстро и фронтенд-разработка не исключение. Следить за новыми инструментами и трендами важно для профессионального роста и конкурентоспособности. Доклады из секции «Перспективы» помогут сформировать понимание текущих направлений, адаптироваться и предлагать современные решения вашим клиентам.
Ловите вторую часть докладов секции, первая здесь
1) Хроники Valibot: Сага о безупречных данных в мире JS. Вадим Царегородцев (Островок!)
В современном фронтенде TypeScript — это стандарт типизации, о котором знают все. Но, к сожалению, не все пользовательские сценарии типизированный язык может покрыть, и приходится использовать другие инструменты. Об одной из таких библиотек и расскажет Вадим.
2) Bun vs Node. Сергей Константинов (Сбер)
Большинство использует Node.js в качестве рантайма для JS. Альтернативные проекты активно развиваются. Например, Bun утверждает, что он быстрее Node.js. Так ли это? Много хардкора и метрик.
Присоединяйтесь к нам 30 сентября и 1 октября на FrontendConf 2024 🙌
✅ Программа конференции, расписание и билеты на сайте
В мире технологий изменения происходят быстро и фронтенд-разработка не исключение. Следить за новыми инструментами и трендами важно для профессионального роста и конкурентоспособности. Доклады из секции «Перспективы» помогут сформировать понимание текущих направлений, адаптироваться и предлагать современные решения вашим клиентам.
Ловите вторую часть докладов секции, первая здесь
1) Хроники Valibot: Сага о безупречных данных в мире JS. Вадим Царегородцев (Островок!)
В современном фронтенде TypeScript — это стандарт типизации, о котором знают все. Но, к сожалению, не все пользовательские сценарии типизированный язык может покрыть, и приходится использовать другие инструменты. Об одной из таких библиотек и расскажет Вадим.
2) Bun vs Node. Сергей Константинов (Сбер)
Большинство использует Node.js в качестве рантайма для JS. Альтернативные проекты активно развиваются. Например, Bun утверждает, что он быстрее Node.js. Так ли это? Много хардкора и метрик.
Присоединяйтесь к нам 30 сентября и 1 октября на FrontendConf 2024 🙌
Please open Telegram to view this post
VIEW IN TELEGRAM
Figma презентации
Искал новый инструмент для презентаций на Windows. Power Point мощный, но неудобный, а Keynote в браузере совсем не то, что нативный на MacOS.
Решил попробовать Figma Slide Deck. Составил для вас небольшое ревью.
Плюсы:
+ Удобный инструмент, ничего лишнего, только нужные инструменты: текст, таблицы, картинки
+ Возможность взаимодействия с пользователем посредством стандартных виджетов
+ Классическая фигма, адаптированная под создание слайдов
Минусы:
- Добавление видео только в платной версии
- Отсутствует анимация текста, элементов на странице
- Анимация слайда smart animate работает кривовато (в сравнении с keynote)
- Нет возможности экспорта в pptx, key и др., только pdf
Как инструмент, чтобы быстро накидать слайды без особого интерактива: только текст, картинки и таблицы - отлично. Если нужны анимации, рекомендую посмотреть в сторону других инструментов.
Искал новый инструмент для презентаций на Windows. Power Point мощный, но неудобный, а Keynote в браузере совсем не то, что нативный на MacOS.
Решил попробовать Figma Slide Deck. Составил для вас небольшое ревью.
Плюсы:
+ Удобный инструмент, ничего лишнего, только нужные инструменты: текст, таблицы, картинки
+ Возможность взаимодействия с пользователем посредством стандартных виджетов
+ Классическая фигма, адаптированная под создание слайдов
Минусы:
- Добавление видео только в платной версии
- Отсутствует анимация текста, элементов на странице
- Анимация слайда smart animate работает кривовато (в сравнении с keynote)
- Нет возможности экспорта в pptx, key и др., только pdf
Как инструмент, чтобы быстро накидать слайды без особого интерактива: только текст, картинки и таблицы - отлично. Если нужны анимации, рекомендую посмотреть в сторону других инструментов.
@ts-check
Когда ты, маленький проказник, пишешь
@ts-check это директива, позволяющая включить проверку типов TypeScript внутри вашего JavaScript файла. Это очень удобно, по сколько далеко не всегда нам нужен TS и маленькие проекты, порой, быстрее написать на JS. А если к этому добавить и JSDoc, то мы получим полностью типизированную функцию.
Как это работает?
Подключим
Когда ты, маленький проказник, пишешь
// @ts-ignore в своем проекте, наверняка замечал и ни раз, что IDE предлагает набрать // @ts-check и задавался вопросом: «а что он делает?»@ts-check это директива, позволяющая включить проверку типов TypeScript внутри вашего JavaScript файла. Это очень удобно, по сколько далеко не всегда нам нужен TS и маленькие проекты, порой, быстрее написать на JS. А если к этому добавить и JSDoc, то мы получим полностью типизированную функцию.
Как это работает?
Подключим
@ts-check в начале файла и опишем функцию greet, а для того, чтобы TS имел информацию об ожидаемых и возвращаемых типах в функции задокументируем её с помощью JSDoc.// @ts-check
/**
* @param {string} greeting
* @return {string}
*/
function greet(greeting) {
return greeting;
}
greet('Hello');
Frontend Conf 2024
Уже совсем скоро начнётся конференция Frontend Conf 2024. В прошлом году я пропустил участие в качестве спикера, но в этом дал себе слово обязательно выступить. Доклад получился по настоящему содержательным и интересным, об этом даже написал Зар Захаров в своём блоге.
Доклад посвящен сравнению Bun с Node. Действительно ли Bun настолько хорош, как нам заявляют статьи? Те кто подписан на канал знают, что не всё так просто. И не смотря на противоречия, я нашел то, что можно использовать уже сегодня и это работает хорошо!
Кстати, конференция пройдёт с 30.09-01.10. Я выступаю 1 октября в 13:20, и если кто будет на конференции - приходите на доклад, буду рад пообщаться!
P.S. Накидайте историй успешного или не успешного использования Bun? А может вы пробовали Deno?
Уже совсем скоро начнётся конференция Frontend Conf 2024. В прошлом году я пропустил участие в качестве спикера, но в этом дал себе слово обязательно выступить. Доклад получился по настоящему содержательным и интересным, об этом даже написал Зар Захаров в своём блоге.
Доклад посвящен сравнению Bun с Node. Действительно ли Bun настолько хорош, как нам заявляют статьи? Те кто подписан на канал знают, что не всё так просто. И не смотря на противоречия, я нашел то, что можно использовать уже сегодня и это работает хорошо!
Кстати, конференция пройдёт с 30.09-01.10. Я выступаю 1 октября в 13:20, и если кто будет на конференции - приходите на доклад, буду рад пообщаться!
P.S. Накидайте историй успешного или не успешного использования Bun? А может вы пробовали Deno?
GoodbyeDPI получил апдейт, который пофиксил все существующие проблемы прошлой версии
Чтобы опять смотреть YouTube в 4К, нужно:
🔴 Скачать последнюю версию тут;
🔴 Запустить файл 1_russia_blacklist_YOUTUBE.cmd;
🔴 Если не сработало, то запускаем 1_russia_blacklist_YOUTUBE_ALT.cmd;
Важно: для корректной работы нужно отключить поддержку Kyber в настройках Chrome. Это можно сделать по маршруту
Сергей Константинов | IT и не только. Подписаться!
Чтобы опять смотреть YouTube в 4К, нужно:
Важно: для корректной работы нужно отключить поддержку Kyber в настройках Chrome. Это можно сделать по маршруту
chrome://flagsСергей Константинов | IT и не только. Подписаться!
Please open Telegram to view this post
VIEW IN TELEGRAM
Frontend Conf 2024 💛
Вот и подошла к концу ежегодная крупнейшая конференция по фронтенду. Принять участие в этом ивенте безумно круто, а быть в роли спикера — совершенно другой уровень!
Хочу выразить особую благодарность всем членам ПК за такую классную атмосферу и организацию. В особенности хочу сказать спасибо Алексею Авдееву, Зару Захарову и Андрею Смирнову за помощь в подготовке и конструктивный фидбэк, который помог создать содержательный, интересный и динамичный доклад.
Был рад пообщаться со всеми, с кем довелось пересечься. Рад был встретить уже знакомые лица спикеров и участников, в том числе с прошлых конференций.
До встречи в следующем году!
Вот и подошла к концу ежегодная крупнейшая конференция по фронтенду. Принять участие в этом ивенте безумно круто, а быть в роли спикера — совершенно другой уровень!
Хочу выразить особую благодарность всем членам ПК за такую классную атмосферу и организацию. В особенности хочу сказать спасибо Алексею Авдееву, Зару Захарову и Андрею Смирнову за помощь в подготовке и конструктивный фидбэк, который помог создать содержательный, интересный и динамичный доклад.
Был рад пообщаться со всеми, с кем довелось пересечься. Рад был встретить уже знакомые лица спикеров и участников, в том числе с прошлых конференций.
До встречи в следующем году!
Репозиторий с бенчмарками
Как обещал, делюсь с вами ссылкой на репозиторий bun-vs-node-benchmarks, где собраны все бенчмарки, которые я использовал для тестирования.
Больше информации и ссылок вы найдёте в презентации с доклада.
Как обещал, делюсь с вами ссылкой на репозиторий bun-vs-node-benchmarks, где собраны все бенчмарки, которые я использовал для тестирования.
Больше информации и ссылок вы найдёте в презентации с доклада.
This media is not supported in your browser
VIEW IN TELEGRAM
Canvas - пишем код в ChatGPT
OpenAI зарелизили рабочую среду Canvas. Здесь можно писать код, проводить код-ревью, искать ошибки, комментировать и рефакторить как душе угодно.
Звучит хайпово. Стало куда удобнее работать с кодом в чате. Сам пока не тестил, прикрепляю видео интро.
OpenAI зарелизили рабочую среду Canvas. Здесь можно писать код, проводить код-ревью, искать ошибки, комментировать и рефакторить как душе угодно.
Звучит хайпово. Стало куда удобнее работать с кодом в чате. Сам пока не тестил, прикрепляю видео интро.