JavaScript *

Вы когда-нибудь пробовали скачивать видео с YouTube? Я имею в виду ручками, а не через такие софтины, как youtube-dl, yt-dlp или один из «этих» сайтов. Оказывается, это гораздо сложнее, чем можно было бы подумать.

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

• Underrun (победитель в 2018 году);
• Ninja vs Evil-corp (победитель в 2020 году);
• Beat Rocks (второе место в 2021 году).

Итак, мы с вами добрались до третьей, самой «хардовой» части цикла. Сегодня поговорим про gRPC.

Что такое gRPC? 

Сам RPC — удалённый вызов процедур (иногда вызов удалённых процедур; RPC от англ. remote procedure call) — класс технологий, позволяющих программам вызывать функции или процедуры других программ, делая это так, как если бы они находились в одном адресном пространстве. Буква g в названии — это гугловая реализация этих технологий.

Разберем это все на примере.

Допустим, что вы — программист и сидите в монолитной репе. У вас одно приложение. Сам проект открыт в IDE и вы в нем работаете. В репе реализован определенный класс (например, на Kotlin), у которого есть метод, возвращающий вам данные по пользователю.

Только что вышла IntelliJ IDEA 2023.2. В этом релизе в IDE появилась куча интересных фичей и важных улучшений.

Вы можете скачать последнюю сборку с официального сайта, или из бесплатного приложения Toolbox, или из snap-пакетов для Ubuntu.

Этот релиз IntelliJ IDEA 2023.2 представляет вам AI-ассистента, вооруженного набором инструментов машинного обучения. IntelliJ Profiler показывает подсказки в редакторе, делая профилирование более интуитивным и иформативным. Еще, в этом релизе появилась интеграция с GitLab.

В том посте мы пробежимся по всем основным фичам IntelliJ IDEA 2023.2. В отличие от официального анонса, вся европейская политкорректность выкинута на свалку, автор перевода не видит никакой ценности в соблюдении повесточки.

Кроме того, в этот четверг в Питере будет встреча Javawatch, посвященная Java 21. Я прочитаю мини-доклад минут на 30 о новых фичах, и потом мы сможем все вместе собраться и за кружкой пива это обсудить. Анонс события в телеге, обсуждение в чате. Я бывший PMM в JetBrains Big Data и тимлид в Remote Development/Projector, а сейчас работаю над российским дистрибутивом Java - Axiom JDK.

Веб — богатая экосистема с массой мощных API, которая только пополняется. В нашем распоряжении уже знакомые инструменты — Canvas или Intersection Observer, но в 2023 мы также имеем Web MIDI API, Speech Recognition и даже такие экзотические штуки, как геймпады и VR прямо в браузере. Естественно, эти API сложно использовать в Angular из-за разницы парадигм нативного JavaScript и декларативного Angular. Вот тут и появляемся мы!

Статья-туториал для тех, кто хочет узнать, как из заголовка получается «6» методом рекурсивного спуска. Начнём с самого простого и дойдём до вычисления -1.82 или около того из строки -2.1+ .355 / (cos(pi % 3) + sin(0.311)).

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

JP Camara, главный инженер Wealthbox, в своём блоге поделился интересным опытом ускорения TanStack Table — новой версии React-библиотеки для создания функциональных таблиц — аж до 10 мс. Делимся с вами переводом его статьи.

Решим реальную практическую задачу, с которой мне пришлось столкнуться на моем проекте React/TypeScript.

Задача

У нас есть массив конкретных строковых значений, таких как "first", "second", "third", "fourth" и "fifth". Необходимо отобразить их на странице, т.е как-то использовать, а также убедиться, чтобы эти данные были строго типизированы и TypeScript нам выдавал всплывающие подсказки при их использовании в коде.

В декабре 2021 года под новогодние праздники в приложении Кинопоиска для SmartTV появился раздел с Яндекс Музыкой. Он позволил пользователям на телевизорах открывать новые для себя треки в Моей волне, включать популярные подборки и слушать собственную коллекцию на телевизорах.

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

Меня зовут Лена и я фронтенд-разработчик Яндекс Музыки. В этой статье я расскажу про особенности работы SmartTV и разработки под них на примере свежей фичи, которую мы назвали Время клипов. Теперь в приложении вы можете посмотреть клипы любимых артистов и открывать для себя новых исполнителей, которые подходят вам по настроению.

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

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

Для нашего проекта combat-sport.club как раз актуальна ситуация, когда взвешивание перед проведением соревнований нередко происходит в каком-нибудь подвальном помещении с плохой связью, и тяжелый SPA с большим количеством медиа может грузиться очень долго. В свою очередь это влияет и на возможность работать с платформой и в целом на удовлетворенность пользователей.

Можно считать это как продолжение серии моих статей про оптимизацию в целом: раз и два.

В этой статье я рассмотрю один из методов оптимизации сайта для пользователей с медленной скоростью интернета - Network Information API. Это API с большим набором различной информации о сети, но пока не с самой лучшей поддержкой среди браузеров. Тем не менее это не повод не использовать его для тех пользователей, чей браузер это поддерживает - а это около 73% глобальных пользователей. Примеры кода будут на Vue.

Привет, Хабр! Сегодня предлагаем подборку книг для JavaScript-разработчика. Подобраны они в порядке усложнения материала. То, что в начале подборки, пригодится начинающему специалисту (правда, перечитать не помешает и профи). А ближе к концу — книги для более опытных разработчиков. Если же у вас есть собственные предпочтения, то расскажите о них тоже — поделитесь в комментариях.

Привет! Продолжаем цикл статей про тестирование не-REST-бэкенда, в прошлый раз мы говорили о GraphQL, теперь пришло время WebSocket.

Итак, что такое WebSocket?

Википедия сообщает, что это «протокол связи поверх TCP-соединения, предназначенный для обмена сообщениями между браузером и веб-сервером, использующий постоянное соединение».

Что тут важно — что это протокол (со всеми вытекающими последствиями для протокола), который использует постоянное соединение.

Работу по WebSocket в обычной жизни можно представить примерно так.

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

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

ОК, что вам делать в такой ситуации?

В 2012 году Angular.js серьёзно поменял frontend-разработку. Фреймворку от Google тогда очень быстро удалось снискать популярность у разработчиков.

И вот уже буквально через два года его разработчики решили объявить о выходе новой версии под именем Angular 2. Версия оказалось написанной полностью с нуля и не имела совместимости с предыдущей даже близко. Большинство разработчиков, не исключая и вашего покорного слугу, идея переписывать их приложения явно не прильщала. Писать приложения на старой версии, которая с припиской JS, тоже было так себе вариантом. Конкурирующие фреймворки уже были ничуть не хуже.

Одним из них мы и воспользовались, переведя в 2015 году нашу фронтенд-разработку на React. У него была простая архитектура, основанная на компонeнтном подходе и рассчитанная на то, чтобы не терять в производительности труда с ростом кодовой базы.

Сообщество Реакта с тех пор значительно выросло и вот недавно команды React и Next.js показали нам Server Components, новый способ разработки веб-приложений, который со стандартным React-приложением совместим примерно никак.

Это такое же серьёзное изменение как и переход с Angular.js на Angular 2? React сейчас проходит через ту же фазу, что и Angular.js когда-то?

Замечание: В этой статье я буду обсуждать фичи как от команды React так и от Next.js. Работают они сейчас очень тесно, так что зачастую трудно сказать, кто из них за что ответственен. Так что буду писать просто, "React" имея в виду обе команды.

Я разрабатываю роботов и меня часто спрашивают — «как сделать робота», «где ты находишь информацию, какие ресурсы используешь»?

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

Привет! Представляю вашему вниманию перевод статьи Matt Pocock.
Источник

TypeScript 5.2 представит новое ключевое слово - 'using', которое можно использовать, чтобы избавиться от чего угодно с помощью функции Symbol.dispose, при покидании области видимости.

Привет! Меня зовут Наташа, я фронтенд-разработчик в отделе рекламных спецпроектов KTS.

В отделе рекламных спецпроектов мы делаем множество сервисов в мини-приложениях VK, Одноклассниках, Телеграме, создаём лендинги.

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

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