Как стать автором
Обновить
152.09

JavaScript *

Прототипно-ориентированный язык программирования

Сначала показывать
Порог рейтинга
Уровень сложности

Cache API — кэшируем данные на стороне клиента

Уровень сложностиСредний
Время на прочтение6 мин
Количество просмотров5.5K

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

Разберемся, как мы можем его использовать, сравним с другими методами организации кэша на стороне клиента, а также реализуем новостную ленту с применением Cache API.

Читать далее
Всего голосов 5: ↑5 и ↓0+5
Комментарии13

ECMAScript 6+ vs TypeScript

Время на прочтение19 мин
Количество просмотров6.5K

Минули те времена, когда разработчики писали Frontend на «чистом» JavaScript (вплоть до ECMAScript 5). Все изменилось с выходом в свет версии ECMAScript 6 в 2015-м году. Это событие стало, по истине значимым в мировой Frontend разработке. Предыдущие 6 лет до этого, язык практически не менялся. Годом ранее, в 2014-м, компания Microsoft опубликовала TypeScript 1.0 и предоставила встроенную поддержку языка в своей IDE VisualStudio 2013. На самом деле, официально, TypeScript был выпущен еще в 2012 (версия 0.8), однако, популярностью он не пользовался в виду практически полного отсутствия поддержки со стороны существующих, на тот момент, IDE.

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

Типизацию TypeScript рассматривать в этой статье не будем, т.к. очевидно, что в ECMAScript её нет, и сравнивать тут нечего.

Для чистоты эксперимента код будем транспилировать в старый добрый ECMAScript 5. TypeScript, для удобства, возьмем версии 4.8.4 (этой версии, для целей статьи достаточно) и будем компилировать его родным tsc компилятором. Для ECMAScript воспользуемся инструментарием Babel.

Читать далее
Всего голосов 10: ↑3 и ↓7-4
Комментарии15

Где учить Frontend бесплатно в 2024 году

Уровень сложностиПростой
Время на прочтение7 мин
Количество просмотров32K

В 2024 году изучать frontend по-прежнему актуально. Вот несколько причин, почему это может быть полезным:

1. Развитие технологий: Веб-технологии постоянно развиваются, и в 2024 году можно ожидать еще большего прогресса. Изучения frontend поможет быть в курсе последних тенденций и использовать новые инструменты и фреймворки.

2. Рост спроса на разработчиков: Веб-разработка остается одной из самых востребованных отраслей IT. Спрос на frontend-разработчиков будет продолжать расти, так как все больше компаний стремятся создавать привлекательные и функциональные веб-приложения.

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

4. Комбинированные навыки: Знание frontend-разработки может быть полезным дополнением к другим IT-навыкам. Например, если вы уже знаете backend-разработку, изучение frontend поможет вам создавать полноценные веб-приложения самостоятельно.

5. Творческий потенциал: Frontend-разработка предоставляет возможность реализовать свои творческие идеи и создавать уникальные пользовательские интерфейсы. Вы сможете воплотить свою визуальную концепцию и улучшить пользовательский опыт.

В целом, учить frontend в 2024 году будет полезно для тех, кто хочет развиваться в сфере веб-разработки, создавать современные и инновационные веб-приложения и иметь перспективы для карьерного роста.

Читать далее
Всего голосов 13: ↑12 и ↓1+11
Комментарии14

Важные аспекты Unicode, о которых должен знать каждый разработчик JavaScript

Уровень сложностиСредний
Время на прочтение22 мин
Количество просмотров7.8K


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


Я старался избегать работы с Unicode до тех пор, пока не столкнулся с проблемой, требующей глубокого понимания этого стандарта, а других вариантов решения просто не было.


Приложив определенные усилия, прочитав кучу статей — я постепенно начал понимать что к чему, и это оказалось не так уж трудно. Хотя, некоторые статьи приходилось перечитывать раза по 3.


Как оказалось, Unicode — это универсальный и удобный стандарт, но работать с ним может быть непросто из-за множества абстрактных терминов.


Если у вас есть пробелы в понимании Unicode, то сейчас самое подходящее время их заполнить! Заварите себе вкусный чай или кофе ☕. И давайте погрузимся в удивительный мир абстракций, символов, астралов (astrals) и суррогатов (surrogates).


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


Вы также узнаете, как JavaScript взаимодействует с Unicode и какие трудности могут возникнуть на этом пути.


А также, каким образом новые функции из ECMAScript 2015 могут помочь в решении этих проблем.


Готовы? Давайте начнем!

Читать дальше →
Всего голосов 43: ↑43 и ↓0+43
Комментарии6

Истории

Как мы используем Puppeteer для создания Open Graph изображений с Node.js

Уровень сложностиПростой
Время на прочтение7 мин
Количество просмотров2.4K

В наше время многочисленные сайты создают страницы, которыми пользователи хотели бы делиться в разных социальных сетях или мессенджерах. Благодаря тегам Open Graph ссылки могут иметь красочное превью изображение, которое привлекает еще больше внимания. В этой статья я хотел бы рассказать как с помощью Puppeteer и node.js мы упростили поддержку и сократили время разработки при создании таких изображений.

Узнать больше
Всего голосов 4: ↑4 и ↓0+4
Комментарии0

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

Уровень сложностиПростой
Время на прочтение9 мин
Количество просмотров11K

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

Читать далее
Всего голосов 54: ↑47 и ↓7+40
Комментарии8

Личный опыт: переход с Redux на Effector. И при чем тут DX

Уровень сложностиСредний
Время на прочтение6 мин
Количество просмотров5.3K

Frontend-разработка очень богата различными инструментами. Новые фреймворки и библиотеки выходят чуть ли не каждый день и, к сожалению, не все из них одинаково полезны или могут сделать ваш продукт лучше. Кроме того, они различаются по степени удобства именно для разработчика. Есть такое понятие DX – Developer eXperience – по аналогии с UX. Это то, насколько разработчику удобно, интуитивно понятно пользоваться определенным сервисом.

Меня зовут Аня, я frontend-специалист в компании SimbirSoft с опытом в разработке более трех лет. Уже успела поработать со многими инструментами, участвовала в проекте, где переносили огромное приложение на новые библиотеки, в том числе заменяли Redux на Effector. В этой статье хочу поделиться своими мыслями об этих стейтменеджерах с точки зрения DX. 

Да, их сравнивали много раз, но мой акцент будет на том, как писать код на Effector для привычных кейсов в Redux. Подчеркну, DX — это не про рациональные аргументы, а про комфорт, фэншуй и тому подобные вещи (вы же понимаете, о чем я, правда?…).

Забегая вперед, хочу сказать, что Effector мне понравился. И прежде всего своей простотой — да-да, один из наших любимых принципов KISS). И может быть, что я по поводу Effector испытываю ещё какую-то национальную гордость, потому что это разработка ребят из России.

Читать далее
Всего голосов 9: ↑7 и ↓2+5
Комментарии43

Как я использую GigaChat для Frontend разработки

Уровень сложностиПростой
Время на прочтение3 мин
Количество просмотров17K

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

GigaChat - это мультимодальная модель (аналог ChatGPT от OpenAI), которую разрабатывает Сбер. В отличие от языковых моделей, мультимодальные работают не только с текстом. Они могут генерировать иллюстрации.

Читать далее
Всего голосов 11: ↑6 и ↓5+1
Комментарии17

Анализ системы защиты от ботов на примере letu.ru

Уровень сложностиСредний
Время на прочтение40 мин
Количество просмотров5.4K

Анализ системы защиты сайта от ботов на примере letu.ru с использованием javascript reverse engineering.

Читать далее
Всего голосов 30: ↑30 и ↓0+30
Комментарии15

Почему не любят JavaScript?

Уровень сложностиПростой
Время на прочтение5 мин
Количество просмотров23K

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

Читать далее
Всего голосов 36: ↑26 и ↓10+16
Комментарии171

Кто на самом деле пользуется is-odd и is-even?

Уровень сложностиПростой
Время на прочтение4 мин
Количество просмотров15K

Разработчики любят подшучивать над раздуванием зависимостей Javascript (и вполне имеют на это право, учитывая историю пакетов наподобие left-pad); при этом часто упоминаются пакеты is-even и is-odd. Поэтому я заинтересовался, кто же на самом деле их использует?

Читать далее
Всего голосов 28: ↑27 и ↓1+26
Комментарии18

Создание сетевой игры с помощью Collagen_2, Node.js и библиотеки socket.js

Время на прочтение12 мин
Количество просмотров3.1K

В данной статье будет описан простой способ создания сетевой онлайн мини игры на подобии небольшой чат комнаты. Игроки могут передвигаться по полю игры, прятаться за деревьями, также есть возможность управлять камерой вида. Для тестирования игры необходимо скачать редактор зайти в папку collagen_2/games/game_3, ввести в командной строке forever start app.js. Для работы игры требуются модули socket.js и forever(глобальная инсталяция).

Читать далее
Всего голосов 4: ↑4 и ↓0+4
Комментарии3

React + Three.js. Создаём собственный 3D шутер. Часть 3

Уровень сложностиСредний
Время на прочтение9 мин
Количество просмотров9.6K

Привет, дорогие пользователи мира IT!

В эпоху активного развития веб-технологий и интерактивных приложений, 3D-графика становится всё более актуальной и востребованной. Но как создать 3D-приложение, не теряя преимуществ веб-разработки? В этой статье мы рассмотрим, как сочетать мощь Three.js с гибкостью React, чтобы создать собственную игру прямо в браузере.

В статье вы познакомитесь с библиотекой React Three Fiber и научитесь создавать интерактивные 3D-игры.

Читать дальше →
Всего голосов 8: ↑8 и ↓0+8
Комментарии6

Ближайшие события

Причины говнокода во фронтенде. Мнение мимокрокодила

Уровень сложностиПростой
Время на прочтение10 мин
Количество просмотров35K

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

Читать
Всего голосов 77: ↑65 и ↓12+53
Комментарии118

Сжатие css классов. Как сделать веб Ещё быстрее. next.js

Время на прочтение3 мин
Количество просмотров6.5K

Порою, заходя в стили проектов, я невольно пугаюсь сложившейся длине имён - модуль, блок, элемент, подэлемент, модификатор 1, модификатор 2. Длинные классы увеличивают вес страницы, это в свою очередь означает увеличение времени загрузки самого главного для рендера страницы - документа и файла стилей, от которых напрямую зависят метрики FCP, LCP.

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

Читать далее
Всего голосов 5: ↑5 и ↓0+5
Комментарии26

Symbiote.js 2.0

Уровень сложностиПростой
Время на прочтение5 мин
Количество просмотров5.9K

Всем привет! 

Спешу сообщить о выходе новой версии замечательной фронтенд-библиотеки Symbiote.js! Никогда не слышали о ней? Самое время познакомиться.

Symbiote - это компактная, но очень мощная библиотека для создания веб-компонентов и приложений на их основе. Да, я знаю, у нас уже есть React, Vue, Svelte, LitElement и прочее. И может быть, не очень понятно, зачем вникать во что-то еще… Но не торопитесь с выводами, Симбиоту есть, что вам предложить.

Читать далее
Всего голосов 11: ↑10 и ↓1+9
Комментарии9

JavaScript однопоточный или многопоточный? Ставим точку

Время на прочтение11 мин
Количество просмотров30K

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

Читать далее
Всего голосов 46: ↑40 и ↓6+34
Комментарии186

Подписываемся на датчики

Уровень сложностиСредний
Время на прочтение6 мин
Количество просмотров7K

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

Читать далее
Всего голосов 6: ↑6 и ↓0+6
Комментарии0

О кастомных HTML-тегах по-человечески и как их использовать

Уровень сложностиСредний
Время на прочтение7 мин
Количество просмотров12K

Расскажу вам о том, как использовать чудо-юдо под названием «Кастомные HTML‑теги» понятно, но подробно.

Читать далее
Всего голосов 44: ↑43 и ↓1+42
Комментарии38

#Net

Уровень сложностиСредний
Время на прочтение10 мин
Количество просмотров2.8K
image

Oчень добрый день. Меня зовут Тимур и я программист.

В прошлой своей статье я вкратце описал как можно внести минорные правки в код хромиума, собрать его и подтянуть в собственную сборку электрона. Статья имела оглушительный успех и вызвала бурные дебаты (34 комментария знаете ли) и, как только головокружение от успеха прошло, я немедленно бросился писать следующую. Собственно не прошло и трех лет (всего два так то) и вот она готова. Давайте взглянем.
Читать дальше →
Всего голосов 14: ↑13 и ↓1+12
Комментарии5