Да, про эту нейросеть сейчас слышно отовсюду, как она пишет текста песен, сдает экзамены, пишет куски кода, но я подумал, а сможет ли она сама целиком завершить проект под моим руководством?
JavaScript *
Прототипно-ориентированный язык программирования
Осваиваем TypeScript: 21 лучшая практика при написании кода
TypeScript является популярным открытым языком программирования, идеально подходящим для современной разработки. За счёт своей продвинутой системы типов он позволяет писать более надёжный, обслуживаемый и масштабируемый код. Однако, чтобы задействовать весь потенциал этого языка и создавать высококачественные проекты, важно понимать лучшие практики и следовать им.
В этой статье мы углубимся в мир TypeScript и изучим 21 лучшую практику, с помощью которых вы сможете повысить свой навык работы с этим языком. Эти практики охватывают широкий спектр тем и сопровождаются конкретными вариантами применения в реальных проектах. Независимо от того, являетесь ли вы начинающим либо опытным разработчиком на TS, эта статья даст вам ценное понимание и рекомендации, которые помогут писать более чистый и эффективный код.
Нельзя просто так взять и распарсить этот JSON на JavaScript
JSON является одним из очень простых, но в то же время эффективных языков для хранения и передачи данных. Он настолько популярен, что, пожалуй, может считаться самым совместимым форматом представления данных в мире.
Одновременно с этим, JavaScript является одним из наиболее популярных языков программирования и применяется практически везде. Также, нужно понимать, что JSON появился напрямую из JavaScript и эти два языка просто созданы друг для друга.
Но что же может пойти не так, спросите Вы? Просто попробуйте распарсить этот JSON-документ…
Js, трюки, наблюдения, бенчмарки и как Лиса уничтожает Хром. Я протестировал всё, что вам было лень
Разные трюки я тестировал на Google Chrome 107.0.5304.107 и Mozilla Firefox 107.0 на Windows 10.
Чтобы результаты всегда были железно воспроизводимыми, я отключил все С-State’ы, ядра зафиксировал на 5 ГГц.
У меня 9900К, это Coffee Lake c AVX256, какие оптимизации применит Jit для вашего процессора — я не знаю, результат на вашем компьютере может отличаться от моего, в т.ч. из-за микроархитектуры процессора.
Скорость парсинга кода тоже входит в бенчмарк, поэтому браузер с быстрым парсером будет впереди.
Истории
Все еще работаете с access token на клиенте? Тогда мы идем к вам
Организация работы с токенами в клиентской части веб‑приложений — тема, которая на слуху давно и многократно обсуждалась, однако далеко не для всех современных веб‑приложений все еще оцениваются риски в этой части, что приводит к уязвимым реализациям.
В статье рассмотрим причины необходимости работы с токеном на клиенте веб-приложений, узнаем ,что лучше для хранения токена: localStorage, sessionStorage или cookie без флага HttpOnly (спойлер, ничего из этого), а также посмотрим на меры воздействия, которые можно использовать для снижения риска утечки токена посредством различных уязвимостей.
Надеюсь, что данная статья будет полезна разработчикам, тестировщикам, аналитикам и архитекторам, в ней постарался рассмотреть вопрос с разных точек зрения и собрать широкую картину.
Создание столбчатых диаграмм с помощью JavaScript
Современный мир буквально переполнен данными, и нам желательно уметь представлять их графически для быстроты и удобства восприятия. Одной из наиболее распространённых техник визуализации данных являются столбчатые диаграммы, и в этой статье я покажу вам, как можно легко создавать их интерактивные версии в JavaScript.
Пять шаблонов загрузки данных для повышения быстродействия сайтов
Фреймворки вам требуются не для всего, но в случае их использования есть ряд способов, позволяющих добиться максимального быстродействия. В данной статье речь пойдёт о пяти шаблонах загрузки данных, которые при уместном применении позволят значительно повысить производительность приложений или сайтов.
Как я написал свой язык и онлайн IDE
Здесь онлайн интерпретатор, здесь документация.
В сентябре 2020 года я учился на 2 курсе. В том же месяце я впервые написал программу, которая мне понравилась. Она создаёт svg изображения растений, здесь её можно потрогать.
Чуть позже я выяснил, что такие программы называют процедурными генераторами. Я увлекся этим, сделал ещё парочку (1, 2).
Вот только на них я потратил куда больше времени. Долго работать над одной вещью мне не понравилось, особенно когда идея реализации уже придумана, остаётся лишь написать код. Следовательно, нужно ускорить создание процедурных генераторов.
Создаём веб-сайт, как будто сейчас 1999 год
Раньше веб был более странным местом
В прошлом году я поставила перед собой цель вернуть дух старого веба, креативность и шарм конца 90-х и начала 2000-х. В те времена не было правил, ты ставил на веб-страницу что угодно, потому что это было твоё пространство, в котором можно делать всё, что пожелаешь.
И для целого поколения Интернет-пользователей наличие собственного веб-сайта было признаком крутости. Именно так обстояли дела тогда, в эпоху до появления социальных сетей и web 2.0, о старых добрых статических личных страничках.
Сайты наподобие Geocities, Angelfire, Tripod и Expage предлагали для всех услуги бесплатного статического хостинга, поэтому произошёл бум количества личных веб-сайтов. У некоторых хостов даже были конструкторы веб-сайтов в стиле drag-and-drop, так что вам даже не нужно было изучать HTML.
Сегодня мы можем посмеяться над этими веб-сайтами, по сравнению с современными изящными и минималистическими сайтами они выглядят карикатурно. Но я считаю, что мы слишком далеко ушли в другом направлении, и сегодня многие веб-сайты выглядят одинаково. Те старые личные веб-сайты были отражением вашей личности.
Знакомство c Reatom
Привет, меня зовут Артём Арутюнян и я автор менеджера состояния Reatom. Этим постом открывается серия обучающих материалов на русском языке, документация на английском доступна на официальном сайте.
А оно вам надо? Думаю, да, потому что Reatom — это универсальное решение, которое позволяет легко пошарить глобальное состояние за микроскопическую (2.5KB) цену, эффективно строить самодостаточные и переиспользуемые логические модули гигантских приложений или просто сделать ваш сетевой кеш реактивным с помощью дополнительного пакета @reatom/async.
В этой статье мы кратко пройдёмся по мотивации и истории, а потом разберём основные фичи и примеры их использования вместе с биндингами к React.js. Похожий разбор есть в виде скринкаста.
Что такое состояние
Привет! Меня зовут Артём Арутюнян, много где меня можно встретить под ником artalar. 10 лет я разрабатываю крупные веб-сервисы, и вот уже четыре года менеджер состояния, исследуя тему реактивности, консистентности данных и состояния. А началось всё с простого вопроса: почему React, самая популярная современная библиотека для написания UI, по умолчанию полностью рушит приложение и показывает белый экран при появлении ошибки в любом компоненте во время рендера?
В данной статье хотелось бы описать и раскрыть формальную сторону вопроса «что такое состояние» для лучшего понимания фундаментальных основ надёжности любого клиентского приложения. Хочется уже поставить точки в некоторых вопросах терминологии, чтобы чётче отвечать на вопросы «что, когда и зачем брать» при выборе библиотек и технологий для клиентского веб-приложения.
Примеров будет немного, т. к. их достаточное описание превратило бы статью в небольшую книжку. Но надеюсь, что сами идеи всё же будут понятны.
Год Тигра в Taiga UI
В предновогодней суете мы любим подводить итоги уходящего года. Эта хорошая традиция помогает вспомнить свои успехи и неудачи, чтобы взять верный курс в новом году.
Весь год я участвовал в разработке потрясающего продукта — Taiga UI. Это библиотека компонентов на Angular, на которой построены сотни продуктов Тинькофф и много других проектов. Наша команда потратила много времени и сил — расскажу, что из этого получилось.
Брендан Эйх о создании JavaScript за 10 дней и о том, что сегодня он сделал бы по-другому
Миллионы современных разработчиков активно используют язык программирования, который родился буквально за 10 дней в период экспоненциального развития интернета. Создатель JavaScript Брендан Эйх не так давно заново обратился к истокам созданного им языка и рассказал о том, как семена, посеянные им в 1995 году, теперь наконец-то взошли.
Ближайшие события
Трудности перевода в разработке: как делать интернациональные проекты и говорить с пользователями на одном языке
В современных приложениях и сервисах часто нужна интернационализация (i18n, от англ. internationalization). Она позволяет создавать интерфейсы с учётом культурных и языковых особенностей пользователей из разных стран. Это требует не только простого перевода, но и некоторых технических решений, порой довольно сложных.
Меня зовут Володин Сергей, я работал руководителем команды разработки VK WorkMail. Сегодня расскажу о том, как инфраструктура переводов позволяет поддерживать 10 языков в нашем продукте и какие технические нюансы стоит учитывать при работе с разными языками. Интернационализация интерфейсов — довольно комплексная и непростая история, хотя на первый взгляд может показаться не слишком приоритетной задачей. Более того, о ней нужно начинать думать в самом начале разработки, чтобы впоследствии не наломать дров.
Эксплойтинг браузера Chrome, часть 1: введение в V8 и внутреннее устройство JavaScript
Cегодня браузеры играют жизненно важную роль в современных организациях, поскольку всё больше программных приложений доставляется пользователям через веб-браузер в виде веб-приложений. Практически всё, что вы делаете в Интернете, включает в себя применение веб-браузера, а потому он является одним из самых используемых потребительских программных продуктов на планете.
Работая дверями в Интернет, браузеры в то же время создают существенные угрозы целостности персональных вычислительных устройств. Почти ежедневно мы слышим новости наподобие "баг Google Chrome активно используется как Zero-Day" или "Google подтвердила четвёртый эксплойт Zero-Day Chrome за 2022 год". На самом деле, эксплойты браузеров не представляют собой ничего нового, их находят уже долгие годы, начиная с первого эксплойта для удалённого исполнения кода, задокументированного как CVE-1999-0280. Первым потенциально публичным раскрытием браузерного эксплойта, используемого в реальных условиях, стал эксплойт Aurora браузера Internet Explorer, который атаковал Google в декабре 2010 года.
JavaScript: управление содержимым веб-страницы с помощью жестов
Привет, друзья!
Еще недавно управление содержимым веб-страницы с помощью жестов можно было наблюдать разве что в фантастических фильмах. Сегодня все, что для этого требуется — видеокамера и браузер (и библиотека от Google
).
В данном туториале мы рассмотрим 5 примеров:
- получение данных с видеокамеры и их отрисовка на холсте (canvas);
- обнаружение и отслеживание кисти руки;
- управление "курсором" с помощью указательного пальца;
- определение жеста "щипок" (pinch);
- нажатие кнопки с помощью щипка.
Все примеры будут реализованы на чистом JavaScript
.
Источником вдохновения для меня послужила эта замечательная статья.
Для обнаружения и отслеживания руки и жестов будет использоваться MediaPipe. Для работы с зависимостями — Yarn.
Код примеров можно найти в этом репозитории.
React, я люблю тебя, но ты сводишь меня с ума
Привет, друзья!
Представляю вашему вниманию перевод этой статьи, вызывавшей определенный резонанс в сообществе React-разработчиков
.
Дорогой React, мы встречаемся уже почти 10 лет. Мы прошли долгий путь вместе. Но ситуация вышла из-под контроля. Нам нужно поговорить.
Картографический фотопроект «По местам съёмок фильма «Брат»
Идея создать проект «По местам съёмок фильма «Брат» пришла спонтанно, когда я собирался в поездку в Санкт-Петербург. Подумал о том, что я могу объединить профессиональные знания в картографии и своё почтительное отношение к фильму, тем более, что совсем недавно было 25 лет со дня выпуска фильма. Стандартные туристические маршруты надоели. Мне не нравится гулять там, где ходят толпы туристов, делая одни и те же фотографии.
Первый этап — это понимание того, где конкретно снят тот или иной фрагмент. Информацию искал в интернете, но многие точки были описаны очень неконкретно. Двор на такой-то улице или Морская набережная, 15Б, а по факту этот дом на 29 подъездов. Приходилось на месте искать точки съемки и делать фото, потом уточнять точки в геоинформационной программе на карте QGIS.
Микроскоп из оптических головок от DVD-привода
Небольшой и доступный проект по сборке лазерного сканирующего микроскопа на основе двух оптических головок и многофункционального инструмента “Analog Discovery”. Одно из преимуществ такого микроскопа в возможности выравнивания лазерного пятна относительно изучаемого образца с точностью до микрометра.
Улучшаем качество кода React-приложения с помощью Compound Components
Я люблю сталкиваться с трудностями. Но с такими, которые можно решить, подумать над интересным решением, подобрать технологию. Люблю быть в потоке, а после решения чувствую себя настоящим профессионалом.
Но есть кое-что, из-за чего я не люблю программировать. Как ни странно, это тоже трудности, только другого рода. Например, когда, чтобы пофиксить баг, приходится разбираться с легаси-компонентом, который написан на классах на 300 строк кода. Разбираясь уже второй час, ловлю себя на мысли, что уже 10 минут просто смотрю в экран, а в голове «из-за угла» выглядывает мысль «Псс, парень, программирование — это не твое». Такие задачи не вызывают удовлетворения.
В этой статье я поделюсь подходом, который поможет уменьшить большие и страшные React-компоненты. Если у вас есть компоненты с кучей условий, которые сложно читать, ревьюить и понимать, что там происходит, то эта статья для вас.
Вклад авторов
alexzfort 9303.0ru_vds 6258.8ilusha_sergeevich 2778.0azproduction 2516.8alizar 2063.6aio350 1783.9phillennium 1670.2TheShock 1133.0spmbt 944.6Sirion 766.0