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

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

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

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

Тирания маргинального юзера. Почему всё вокруг становится примитивнее

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


C каждым годом софт требует всё больше ресурсов: больше памяти, мощного CPU, аппаратного ускорения графики и т. д. Причина в целом понятна. Постоянные тормоза веб-платформы и нового софта — отчасти плата за удобство разработки (с повышением уровня абстракций). Железо становится мощнее, индустрия это использует. Всё нормально.

Но непонятно другое. Почему происходит реальная деградация интерфейсов. Грубо говоря, почему они становятся всё более примитивными и тупыми, словно рассчитаны на жителей «Идиократии» (на КДПВ). И речь не только о веб-сайтах.
Читать дальше →
Всего голосов 176: ↑162 и ↓14+148
Комментарии596

Абсолютный минимум об Unicode на 2023 год (всё ещё — никаких оправданий!)

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

Двадцать лет назад Джоэл Спольски написал: «Не существует такой штуки, как «обычный текст». Если имеется строка, но неизвестно, какую кодировку символов она использует — смысла в этой строке нет. Больше нельзя спрятать голову в песок и притвориться, что «обычный» текст имеет кодировку ASCII.»

Многое изменилось за 20 лет. В 2003 году главный вопрос звучал так: «Что это за кодировка?». В 2023 году такой вопрос больше не стоит: с вероятностью в 98% это — UTF-8. Наконец то! Можно снова спрятать голову в песок!

Читать далее
Всего голосов 53: ↑52 и ↓1+51
Комментарии46

Pet-проекты — это зло. Вредные советы для фронтендеров

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

Привет, Хабр! Меня зовут Александр Водолазских. Я руковожу направлением разработки интерфейсов в СберМаркете и после работы люблю посидеть за кодом, разрабатывая собственные пет проекты. 

Чего я только не кодил по вечерам: писал смарт контракты на Solidity, копался с разными фреймворками и библиотеками, пилил свой убийцу Twitter на react.js... В какой-то момент фронтенд мне поднадоел, и яначал изучать разработку под node, nest, после - на go. А после - начал экспериментировать с мобильной разработкой на Swift.

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

Мой сегодняшний текст — о том, как, мне кажется, нужно и нельзя вести пет-проекты. 

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

Читать далее
Всего голосов 35: ↑32 и ↓3+29
Комментарии23

По заветам кота Вжуха: превращаем веб-приложение в сервис на платформе VK Mini Apps

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

VK Mini Apps — это платформа для создания мини-приложений, работающих внутри ВКонтакте. На ней можно создать продукт любого масштаба — от лендинга до сложного сервиса с множеством функций. А ещё вы можете портировать на площадку ваше веб-приложение, чтобы получить доступ к огромной аудитории VK Mini Apps и новым возможностям монетизации. В этой статье поделюсь пошаговой инструкцией, как превратить в сервис любое веб-приложение — на примере планировщика задач.

Всем хабропривет. Я Леонид Шевчук, старший разработчик. Четыре года создаю мини-приложения. Руковожу командой фронтенд-разработки VK Знакомств. Наш сервис разработан как мини-приложение ВКонтакте. Это яркий пример того, что на платформе VK Mini Apps можно делать продукты с очень развитой функциональностью.

Эта статья пригодится тем, кто ещё не работал с нашей платформой, поэтому я буду рассказывать очевидные для опытных разработчиков вещи. Сначала мы освежим в памяти, на каких технологиях делаются современные веб-приложения. Затем научимся портировать в VK Mini Apps — на примере приложения для планирования дел, написанного на React. И сделаем это так, чтобы оно выглядело органично для платформы. А для чего это всё нужно? Сейчас объясню.

Читать далее
Всего голосов 35: ↑33 и ↓2+31
Комментарии11

Истории

16-, 8- и 4-битные форматы чисел с плавающей запятой

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

Уже лет 50, со времён выхода первого издания «Языка программирования Си» Кернигана и Ритчи, известно, что «числа с плавающей запятой» одинарной точности имеют размер 32 бита, а числа двойной точности — 64 бита. Существуют ещё и 80-битные числа расширенной точности типа «long double». Эти типы данных покрывали почти все нужды обработки вещественных чисел. Но в последние несколько лет, с наступлением эпохи больших нейросетевых моделей, у разработчиков появилась потребность в типах данных, которые не «больше», а «меньше» существующих, потребность в том, чтобы как можно сильнее «сжать» типы данных, представляющие числа с плавающей запятой.

Я, честно говоря, был удивлён, когда узнал о существовании 4-битного формата для представления чисел с плавающей запятой. Да как такое вообще возможно? Лучший способ узнать об этом — самостоятельно поработать с такими числами. Сейчас мы исследуем самые популярные форматы чисел с плавающей запятой, создадим с использованием некоторых из них простую нейронную сеть и понаблюдаем за тем, как она работает.

Читать далее
Всего голосов 132: ↑131 и ↓1+130
Комментарии99

Интересные трюки HTML. Экстремальный минимализм

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

Мы уже много говорили про оптимизацию сайтов до минимального размера, преимущества статичного HTML, а также упаковку сайта (и веб-сервера) в портативный формат одного исполняемого файла, который нативно исполняется под любой ОС.

Но стремление к минимизации может пойти дальше, если вы хотите поместить весь сайт в адресную строку браузера. А с помощью сокращателя ссылок даже большой сайт сжимается до восьми байт. В этом случае и хостинг не нужен (то есть роль хостинга выполняет сервис сокращения ссылок).
Читать дальше →
Всего голосов 62: ↑62 и ↓0+62
Комментарии5

Как я заработал 500 000 рублей, сделав доступ к ChatGPT. А потом Яндекс убил SEO и всё (почти) закончилось

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

Статья о том, как я почти проспал "бум" ChatGPT, но сделал к нему доступ и заработал на этом (и продолжаю зарабатывать). Сам проект сейчас идёт на спад, но об этом в конце.

Читать далее
Всего голосов 98: ↑84 и ↓14+70
Комментарии170

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

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

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

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

Читать далее
Всего голосов 55: ↑53 и ↓2+51
Комментарии27

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

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

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

Читать далее
Всего голосов 70: ↑65 и ↓5+60
Комментарии28

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

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

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

Читать далее
Всего голосов 194: ↑192 и ↓2+190
Комментарии87

Запуск альфа-теста Капибара(Новый Старый Пикабу)

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

Продолжу рассказывать о развитии Капибары, опенсорсном проекте, цели которого воспроизвести лучшее что было на пикабу и не наступить на их же "грабли". Первая часть здесь: https://habr.com/ru/articles/759598/. Первый официальный пост о прогрессе в разработке на новом сайте здесь: https://www.kapi.bar/post/dnevnik-razrabotki-kapibary-ot-10-xi-2023. Но обо всем по порядку.

Пару недель назад у нас стартанул полу-закрытый альфа-тест. Сейчас выдаём ранний доступ на сайт kapi.bar отважным авторам-альфатестировщикам и активным комментаторам взамен просим слать нам багрепорты и пока быть самим себе модераторами. Функционал для создания постов, комментариев и выставления оценок для них есть. Ленты "Новое", "Тренды", "Топ", "Обсуждаемое" и поиск по тегам уже работают и доступны для чтения всем желающим.

Читать далее
Всего голосов 34: ↑32 и ↓2+30
Комментарии21

Почему я не буду использовать Next.js

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

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

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

С момента выхода Remix в 2020 году я использовал именно этот фреймворк. Мне он настолько понравился, что на следующий год я устроился в эту компанию, чтобы помочь с развитием сообщества, а через 10 месяцев ушёл работать в EpicWeb.dev, где теперь обучаю людей всему необходимому для создания фулстек-приложений. И Remix играет в этом значительную роль, являясь веб-фреймворком, который аналогично Next.js нацелен на решение задач, связанных с созданием веб-приложений.

Поскольку Next.js аналогичен Remix, многие спрашивают, почему для преподавания фулстек-разработки в EpicWeb.dev я предпочёл именно Remix. И текущая статья станет ответом на этот их вопрос.
Читать дальше →
Всего голосов 50: ↑44 и ↓6+38
Комментарии18

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

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

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

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

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

Читать далее
Всего голосов 55: ↑54 и ↓1+53
Комментарии63

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

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

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

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


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


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

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

Эффективные бэкапы в S3 с помощью Restic: краткое пособие по настройке

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

В 2007 многие администраторы настраивали бэкапы с помощью утилиты rsync, но для этого нужно было выделять отдельный хост для хранилища. И одной из частых проблем было резервирование этого сервера для бэкапов, которое увеличивало накладные расходы. Также хост бэкапирования располагался рядом с устройствами, для которых нужно было выполнить резервное копирование, настроить мониторинг и другое. Это нарушало правило 3-2-1, поэтому для построения действительно надежной системы нужно располагать хосты в разных дата-центрах.

Сегодня можно прибегнуть к услугам облачного хранения данных — например, использовать объектное хранилище Selectel. В этой инструкции рассмотрим, как работать с ним с помощью утилиты Restic.
Читать дальше →
Всего голосов 36: ↑35 и ↓1+34
Комментарии1

Современный junior frontend developer на двух работах уровня middle с общей ЗП 400к. Реальность ли в 2023 году?

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

Привет. Большая и длинная история, которая только в самом конце превращается в историю успеха. Рекомендуется всем, кто хочет войти в ИТ или уже там.

Читать далее
Всего голосов 109: ↑77 и ↓32+45
Комментарии457

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

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

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

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

Что же пошло не так?
Всего голосов 301: ↑286 и ↓15+271
Комментарии93

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

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


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


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

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

Разбираем TLS по байтам. Где собаки зарыты?

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


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

В первой мы увидели, что такое «защищённое соединение», сколько и каких ключей для него нужно, кто кого шифрует и подписывает, и что такое «сертификат». Сейчас разберёмся, как всё это дело реализуется в протоколе TLS: как выглядит рукопожатие, как сделать ключ шифрования своими руками, в каком виде данные передаются по сети.
Читать дальше →
Всего голосов 39: ↑39 и ↓0+39
Комментарии1

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

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

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

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

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