​Как уменьшить размер JavaScript SDK на 29%

Разработчики из Sentry долго ломали голову над этим вопросом, ведь им необходимо было сохранить все возможности пакета, включая мониторинг производительности, сохраняя при этом управляемые размер пакета. Вдобавок, такой серьёзный рефакторинг мог повлиять на проекты разработчиков, использующих SDK Sentry.

Как в итоге им всё-таки удалось уменьшить размер пакета почти на треть, узнаете тут:

https://blog.sentry.io/2022/07/19/javascript-sdk-package-reduced/

#javascript #рефакторинг

​Что лучше: Flutter или React Native

Споры о том, какая из платформ лучше бурлят уже давно. И умные люди говорят, что всё зависит от конкретной задачи. Но автор этой статьи считает, что так неинтересно и настаивает на том, что Flutter всё же опережает React Native.

С его аргументами можно ознакомиться здесь:

https://shift.infinite.red/flutter-is-better-than-react-native-fed10c92a768

#flutter #reactnative #mobidev

Что почитать. JavaScript для профессиональных веб-разработчиков [4-е издание]

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

В книге вы найдете:

— последнюю информацию о классах, промисах, async/await, прокси, итераторах, генераторах, символах, модулях и операторах spread/rest;
— фундаментальные концепции веб-разработки: DOM, BOM, события, формы, JSON, обработка ошибок и веб-анимация;
— расширенные API-интерфейсы: service workers, fetch, атомизация, потоки, каналы сообщений и веб-криптография;
— а также сотни рабочих примеров кода.

#книга #javascript

​Индексация строк в Rust и TypeScript в сравнениях

И в Rust, и в JavaScript обработка текста на всевозможных письменных языках реализуется посредством такого типа данных, как строка (String). Однако, у каждого языка есть свои особенности, в частности, если речь идёт о графемах или эмодзи.

Давайте посмотрим в чём состоит разница индексации в этих языках:

https://nuancesprog.ru/p/15288/

#rust #javascript

Ещё используете острые углы?! Закругляйтесь

React Cool Inview

Если вы искали способ определять, что за элемент сейчас находится на экране, то библиотека React Cool Inview как раз то, что вам нужно. Это простой в использовании React-хук, который позволяет легко узнать какой сейчас элемент отображается на экране, чтобы затем взаимодействовать с ним.

Подробнее:

https://www.npmjs.com/package/react-cool-inview

#фронтенд #react

Создаём визуализации нажатий с помощью Vue 2 и Vue 3

Для этого нам понадобиться библиотека v-wave, которая позволяет с лёгкостью добавить различные эффекты при нажатии на блоки.

Библиотека и инструкция тут:

https://justintaddei.github.io/v-wave/

#фронтенд #vue #библиотека

Как сделать игру 2048 на React

Игру 2048 знают многие и многие в неё играли. А давайте теперь попробуем реализовать её самостоятельно с автором этого туториала.

В своей версии он использовал хуки библиотеки React, её Context API, а также TypeScript и LESS. Помимо туториала в статье вы найдёте ссылки на игру, её код и демо анимацией:

https://habr.com/ru/company/skillfactory/blog/588356/

#react #gamedev

Хуки жизненного цикла компонентов Angular

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

https://medium.com/@mudit.manucha/actual-use-of-angular-lifecycle-hooks-d922680283c0

#angular #фронтенд

Создаём собственный текстовый редактор на React

Если вам не подходят уже существующие решения для текстовых редакторов, то можно создать своё. Оно будет:

— иметь предустановленные стили элементов;
— настраивать стили текста — курсив, жирность и так далее;
— поддерживать интерактивный элементы, например, ссылки;
— поддерживать хоткеи;
— и импортировать/экспортировать контент в HTML.

Всё это можно реализовать с использованием React, а вернее фреймворка на его основе Draft.js, который специально создан для работы с текстом. Как? Узнаете здесь:

https://habr.com/ru/company/kts/blog/576682/

#react #draftjs #фронтенд

​Как работать с нейросетями на JavaScript

Обычно, когда речь заходит о нейросетях, все сразу вспоминают Python. На самом деле это далеко не единственный язык, где вы можете создать собственную систему машинного обучения. Для JavaScript тоже существуют свои решения, например библиотека Dann.js.

Dann.js — это небольшая,которую легко изучить, поэтому она может стать отличным инструментом для изучения нейронок JS-разработчиками.

Подробнее о библиотеке можно узнать здесь:

https://dannjs.org/

#javascript #ml #dannjs

​Как защитить текст от комбинации Ctrl+F в браузере

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

https://nuancesprog.ru/p/16392/

#фронтенд

​Что такое SEO и как продвинуть сайт в Google

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

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

https://tproger.ru/articles/chto-takoe-seo-i-kak-prodvinut-sajt-v-google/

#seo

Menja — духовный наследник Fruit Ninja на JavaScript

Предлагаем вашему вниманию игру Menja, которая по сути является альтернативной версией Fruit Ninja, но с более геометрическим дизайном. Здесь вам необходимо разрубать пролетающие блоки.

Игра реализовано на JavaScript без сторонних фреймворков. Посмотреть на код и поиграть можно здесь:

https://codepen.io/MillerTime/details/BexBbE

#gamedev #codepen #javascript

30 seconds of code — полезные сниппеты на любой случай

На сайте 30secondsofcode.org собрана большая коллекция сниппетов JavaScript-кода, которые помогают работать с примитивами, массивами и объектами, а также включает алгоритмы, функции управления DOM и утилиты Node.js.

Сохраняйте себе в закладки и не теряйте.

#javascript

​Как профессионально использовать сопоставимые типы TypeScript

Использовали ли вы когда-нибудь сопоставимые типы при работе с TypeScript ? Они позволяют сделать ваш код чище и более читаемым, убрав излишнее дублирование в некоторых частях.

О том, как они работают и как ими правильно пользоваться, узнаете здесь:

https://nuancesprog.ru/p/16399/

#typescript

​Многие смеются над тем, как ведёт себя JavaScript со сложением числе с текстом. Но вы только взгляните на С:

Полезные советы при вёрстке сайта на HTML и CSS

В этом небольшом видео вы узнаете некоторые неочевидные, но важные нюансы, которые помогут улучшить вам качество ваше страницы, повысить скорость её загрузки и сделать разработку немного проще:

https://www.youtube.com/watch?v=41kjGvSPaEw

#видео #html #css

​Как программисту записать свой трек

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

Подробнее о языке, а также инструкция по использованию здесь:

https://github.com/kylestetz/slang

#slang #javascript

Красивые пуши для вашего сайта в стиле MacOS

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

Код тут:

https://codepen.io/jkantner/pen/XWzePgp

#codepen

​Функции высшего порядка в JavaScript – Руководство для начинающих

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

Подробнее о них:

https://www.freecodecamp.org/news/higher-order-functions-in-javascript/

#javascript #основы