Все потоки
Поиск
Написать публикацию
Обновить
341.98

Веб-разработка *

Делаем веб лучше

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

Глубокий JS. В память о типах и данных

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

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

Теория теорией, однако, JS-код исполняется не в теории, а на практике. Точнее, его компилирует и исполняет движок JS. Таких движков существует несколько, разрабатывались они разными людьми и для разных целей. Было бы наивно предполагать, что все они полностью идентичны друг другу. А значит, время разобраться, как же на самом деле хранятся вполне конкретные данные на вполне конкретном движке JS V8.

Читать далее

Сокровища HTML: 7 тегов, которые упростят вам жизнь

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

Все мы знакомы с широко используемыми HTML тегами, такими как <div>, <p>, <a>, и <img>. Однако, существуют HTML - теги, которые могут упростить жизнь, и вместо написания дополнительного кода, выполнят всю работу :)

Читать далее

Географические ограничения на Хабре

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

Несколько лет назад мы рассказали про то, как Хабр обрабатывает официальные обращения, а также анонсировали наш раздел Transparency report, в котором мы своевременно публикуем информацию об обращениях. Что ж, с тех пор кое‑что поменялось и настало время для новой публикации с небольшим апдейтом.

Читать далее

Мнение три года спустя: стоил ли того переход с JavaScript на Rust?

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

Несколько лет назад я отказался от всего и полностью сосредоточился на WebAssembly. В то время Rust имел наилучшую поддержку компиляции в WebAssembly, а самые полнофункциональные среды исполнения WebAssembly были основаны на Rust. Rust был лучшим из вариантов. С места в карьер я нетерпеливо начал разбираться, чем же вызван такой ажиотаж.

С тех пор мы с потрясающими разработчиками создали Wick, — фреймворк приложений и среду исполнения, использующие в качестве системы основного модуля WebAssembly.

Спустя три года, выполнив несколько развёртываний в продакшен, написав электронную книгу и выпустив примерно сто пакетов на crates.io, я решил, что настало время поделиться своими мыслями о Rust.

Читать далее

HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 2

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

Я продолжаю рассказывать, как HTML и CSS могут улучшить или ухудшить доступность интерфейсов. В своём рассказе я использую свой опыт и моего незрячего знакомого Ильи.


В этой статье будет: атрибут autofocus и его нюансы, паттерн «Skip-link» и идея Ильи об использовании его на практике, проблема использования одинаковых ссылок для одной новости, что не так с кнопкой «Наверх» и как вы спрятали список от скринридеров.


Давайте начнём!

Читать дальше →

Сбер. Как некрасиво поступить на конкурсе красоты

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

Хабр - не жалобная книга, я знаю. Но тут история про код, с примерами, разбором антипаттернов и всё такое, поэтому я рискну.

Всё началось, когда я узнал про конкурс красоты кода от Сбера. Я как раз хотел поучаствовать в каком-нибудь эпичным конкурсе, а тут как раз он мне и подвернулся, тем более что я - тот человек, которому есть что рассказать про красивый код. Я даже целую статью запилил о том, как писать красивый и понятный код. Так что что я решил, что в данном случае мои шансы на победу - в отличие от остальных конкурсов - всё же больше 0%. Кроме того, я хотел выступить на конференции PiterPy (спойлер: хрен мне), чтобы рассказать там про красивый код и всё такое, поэтому участие в конкурсе и сравнение результатов было бы классным подспорьем.

Что же пошло не так?

Прокачиваем вёрстку ARIA атрибутами. Атрибут aria-label

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


Cегодня я хочу рассказать про атрибут aria-label. В статье не будет заумных определений и бездумного копирования стандарта. Я хотел простым языком объяснить, какая польза от атрибута, а также передать свой практический опыт, чтобы вы могли его повторить. А получилось у меня или нет, решать вам.


Со вступительным словом всё. Давайте начнём!

Читать дальше →

Какого цвета интернет: история смены окраски веб-страницами

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

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

Читать далее

Macromedia Flash: Взлет и закат технологии

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

Если никто не подведёт итог под историей Macromedia Flash, она рискует затеряться в хламе IT-подвала. Напомню, что “волшебный” плагин Flash player стоял практически на всех компьютерах мира. И в какой-то момент именно эта технология была лучшей для анимации, игр и мультимедиа. В этой статье я расскажу историю технологии и добавлю историю от лица разработчика: что мы создавали, как работали,  плюсы минусы самой платформы и ключевые события. Ну и главное, почему Flash взлетела до массового распространения, а потом потерпела поражение и осталась в прошлом. И ответить на вечный вопрос “Кто виноват?” Иная версия вопроса: Зачем Стив Джобс убил Flash? Спойлер, Джобс не виноват.

Читать далее

Добавили бота в свой Telegram канал? Будьте готовы с ним попрощаться

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

Изучая безопасность мессенджера Telegram, меня поразила одна его "особенность" при работе с ботами - выяснилось, что при добавлении в канал бота никак нельзя ограничить его в правах на удаление подписчиков. То есть, говоря прямо, любой бот может вычистить всю аудиторию канала за считанные минуты.

Читать далее

Прогресс WebAssembly и будущее веба. Быстрые интерфейсы, пример Figma

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

Скетч из статьи Лин Кларк «Создание и работа с модулями WebAssembly»

WebAssembly (Wasm) — это бинарный формат для безопасного и эффективного выполнения портативных программ в стековой виртуальной машине (в браузере или на сервере). Как и ASM.js, представляет собой низкоуровневый код. Есть ещё WAT — WebAssembly Text, человекочитаемая версия бинарного кода.

WebAssembly — не столько язык программирования, сколько цель компиляции, новый вид ассемблера, который работает близко к железу, принимая программы на C, C++, Rust и других привычных языках. При этом Wasm гораздо быстрее ASM.js и выполняет код в браузере почти как нативные программы под любой ОС.
Читать дальше →

Хороший ретрай, плохой ретрай, или История одного падения

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

Порой простое и очевидное решение может потянуть за собой хвост проблем в будущем. Например, добавление ретраев.

Меня зовут Денис Исаев, и я работаю в Яндекс Go. Сегодня я поделюсь опытом решения проблем с отказоустойчивостью из-за ретраев. Основано на реальных инцидентах в системе из 800 микросервисов.

Этот пост — продолжение вымышленных историй о разработчике Васе, который несколько лет назад разбирался с идемпотентностью в распределённых системах. Теперь перед ним новые задачи — получится ли справиться с ними в этот раз? Давайте узнаем.

Читать далее

Разбираем TLS по байтам. Кто такой этот HTTPS?

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


Подключение к сайту бывает защищённым, а бывает нет — это надо знать всем детям. Только мало детей знают, что это значит и как работает.

Я, изучая веб-разработку, узнал об HTTP. Разобраться в нём несложно: в каждой статье о протоколе множество наглядных примеров запросов и ответов. Затем узнал о схеме HTTPS, с которой всё не так наглядно. В ней используется то ли SSL, то ли TLS, и что-то где-то шифруется, и зачем-то нужны какие-то сертификаты. Короче, всё расплывалось в тумане: где пример ответа, запроса, сертификата, как его создать, зачем он нужен и почему гайд по созданию http-сервера уже написал каждый школьник, а https-сервер — недоступная для начинающих разработчиков роскошь?

В связи с этим, предлагаю обсудить протокол TLS и его роль в вебе. Статья состоит из двух частей. В первой поговорим о защите соединения: от чего и как защищаемся, почему именно так, а не иначе, сколько и каких ключей для этого нужно, и разберёмся с системой сертификатов; а в конце создадим свой сертификат и посмотрим, как его использовать для разработки.

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

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

В Go меняется фундаментальная вещь — цикл

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

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


проще показать на примере:


 funcs := []func(){}

 for i := 0; i < 5; i++ {
  funcs = append(funcs, func() {
   fmt.Println(i)
  })
 }

 funcs[0]()

Последняя строка примера напечатает 5 в go 1.21, но в go 1.22 будет уже интуитивно понятный 0.

Читать дальше →

Видеоредактор, работа с видео и зачем там Canvas

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

Современные устройства и браузеры развиваются достаточно быстро, но все-равно этого бывает недостаточно для задач со сложными вычислениями. К таким задачам можно отнести обработку видео.

Одной из задач, где мы в Ozon используем Canvas, является обработка видео. Для это у нас реализован минималистичный видеоредактор. Зачем нужно было делать свой редактор для веба и почему не использовать готовый? Все ответы под катом.

Читать далее

Принцип работы async/await в JavaScript

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


Если вам доводилось работать с JavaScript, то вы наверняка встречались с синтаксисом async/await. Эта функциональность позволяет прописывать асинхронную логику синхронным образом, упрощая тем самым её понимание. Некоторым ветеранам JS известно, что async/await – это просто синтаксический сахар для существующего Promises API. Это означает, что в JS должен быть способ реализации функциональности async/await без использования ключевых слов async и await, хоть и более громоздкий. Именно об этом и пойдёт речь в данной статье.

Видео от автора на ту же тему.
Читать дальше →

Капибара, Новый Старый Пикабу

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

UPD: у нас всё получилось, сайт работает kapi.bar, доработки ещё ведутся.

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

Читать далее

HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи

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

Многие разработчики думают, что доступность реализуется только с помощью aria-атрибутов. Если их не добавить, то всё, доступности нет. Конечно, aria-атрибуты нужны, но HTML и CSS такая же важная часть процесса создания доступных интерфейсов. Эти технологии непросто несут в себе кучу скрытых моментов, влияющих на доступность. Они напрямую позволяют её улучшить. В статье хочу показать это.


Я затрону не все аспекты. Их очень много, поэтому поговорю о: интерактивных элементах, доступности текста, анимации и изображениях. В статье буду использовать опыт моего незрячего знакомого (привет, Илья). Он внёс бесценный вклад. Уверен, что вам будет интересно. Поехали!

Читать дальше →

Назад в будущее Хабра. Трекер 3.0

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

Приветствуем вас, наши дорогие пользователи! Без долгих предварительных ласк: новый трекер, налетайте 🙂

Читать далее

Нарушая правила: как я выбросил 10-месячный проект после 2 месяцев в должности

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

Когда я принял управление командой, её участники находились на 8-м месяце реализации 3-месячного проекта по перезапуску коммерческого сайта компании. Спустя два месяца ведения этой команды, я решил отказаться от всего достигнутого и начать сначала. Это история о том, почему я это сделал, как, и что в итоге получилось.
Читать дальше →

Вклад авторов