htmlshit | Unsorted

Telegram-канал htmlshit - Будни разработчика

14544

Блог Lead JS-разработчика из Хельсинки Автор: @bekharsky По рекламе: https://telega.in/channels/htmlshit/card?r=GLOiHluU или https://t.me/it_adv Чат: https://t.me/htmlshitchat

Subscribe to a channel

Будни разработчика

#заметка дня

Тут Иван Акулов из Framer поделился, как они доставляют AVIF-изображения, добиваясь ещё большей, чем WEBP, экономии трафика.

Да, я в курсе, что многие генерируют картинки при сборке, кто-то использует сервисы и так далее, но давайте не забывать, что:
1. Есть пользовательский контент
2. Облака могут встать дорого

Итак, в чём же проблема? А в том что AVIF ну очень долго кодируется, что не есть хорошо. Там, где на генерацию WEBP уйдёт 100-300 мс, на AVIF — 1-3 секунды.

В итоге, если генерировать изображения по запросу и сохранять на CDN (тем же nginx, например), будет не очень вежливо заставлять посетителя ждать.

Поэтому было решено применять подход, знакомый нам как stale-while-revalidate.

1. С первым запросом генерируем WEBP-картинку, но устанавливаем кеширующие заголовки как Cache-Control to max-age=0, stale-while-revalidate=31536000.
2. Поскольку max-age выставлен в 0, картинка моментально "протухнет", CDN с этим не согласится и отправит второй запрос, чтобы, собственно, закешировать.
3. И вот тут уже начинаем генерировать AVIF.
4. И отправляем его с max-age=31536000, ну, почти навсегда.

Ну и общая статья на тему: https://www.framer.com/help/articles/how-are-images-optimized-in-framer/

Я тут пока готовил этот обзор, хотел найти свой конфиг nginx для генерации и кропа картинок на лету, но... потерял. Кажется, пришло время потренироваться и написать обновлённый, по мотивам.

А как вы доставляете картинки, котаны?

#image #optimization

Читать полностью…

Будни разработчика

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

⚠️ Это повышает вашу насмотренность, понимание кода, да и вы всегда можете сохранить заготовки себе на будущие проекты

Существует множество полезных сайтов, но теперь есть специальный канал для этого: @code_ready

У вас будет все под рукой, с оформленным кодом, примерами, шпаргалками и без занудства

➡️ Так что подписываемся

Читать полностью…

Будни разработчика

#такое дня

Не, не могу молчать. Андрей Ситник снова пошёл священной претензией на сообщество фронтенда.

И снова с Линуксом.

Итак, суть подачи: «Во фронтенде бесит, что люди так много говорят про diversity и адаптивность к разным системам, а все сидят на Маках».

Начнём с того, что не все сидят на маках, но все, кто выступает на конференциях 🙂 Ошибка выжившего как она есть.

А дальше... давайте сначала ваше мнение, котаны. Выше — опрос про вашу ОС для работы.

Если вам будет интересно — напишу свой путь и выбор инструментов.

Читать полностью…

Будни разработчика

#фишка дня

Иногда встаёт задача не просто проиллюстрировать статью, но обрезать (кропнуть) исходное изображение. И желательно так, чтобы результат был адаптивен и адекватно реагировал на масштабирование.

Джейк Арчибальд предлагает решение на SVG и foreignObject: https://codepen.io/alinaki/pen/KKLXvwz

Вообще, весьма красиво. Да, можно генерировать кропы на сервере, но это, как минимум, лишние телодвижения. А тут – одна картинка, чистый и понятный код.

#svg #img #foreignObject #crop

Читать полностью…

Будни разработчика

#такое дня

Я знаю, вы любите стыдный контент.

После трёх релизов подряд, в которых не было ничего, кроме исправления z-index (не спрашивайте), проверяющий мои PRы бакендщик (остальные в отпуске), заметил:

— Я-то хотя бы жисоны перекладываю...

Давайте ваши свежие стыдные истории, котаны.

Читать полностью…

Будни разработчика

Реклама. ООО «Яндекс.Облако» ИНН 7704458262
Erid: 3apb1Qrwwr2uBg1WocnEFwJfQb4K3dy5grNscboPtJRyZ

Читать полностью…

Будни разработчика

#автор дня

Итак, я не так давно, буквально пару месяцев назад, выкладывал репозиторий Сергея Ufocoder'а, посвящённый утечкам памяти в JavaScript. Ну, вот же, положила: /channel/htmlshit/2668

Думаю, сегодня можно выложить кое-что ещё :)

Некоторое время Сергей занимается разработкой простого FPS. И пришло время показать первые результаты!

Собственно, перед нами однопользовательская игра в стиле Wolfenstein 3D.

Использует подход к отрисовке графике из 1990-х, в частности алгоритм raycasting (все графические вычисления происходят на CPU).

Написана с нуля, то есть без использования сторонних библиотек.

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

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

Репозиторий: https://github.com/ufocoder/fps
Играть: https://ufocoder.github.io/fps/

Если вы, котаны, задались целью понять, как работают 3D-движки на базовом уровне — это вот самое то :)

#game #fps

Читать полностью…

Будни разработчика

#заметка дня

В чате вопрос возник: «А при каких условиях и на что нужно ставить role=“button”?»

Вопрос весьма разумный, ведь вроде как кнопка она и есть кнопка, button. Вот только не всё так просто.

Для начала давайте определимся раз и навсегда: ссылки вместо кнопок не используются никогда.

Ссылка – это или переход к якорю на этой же странице, или же переход на другую страницу и только. Никаких a[href=“#”] с onClick, забудьте.

Остаются button, input[type=“button”] и input[type=“submit”].

Последние потомков внутри не предполагают и являются замещаемыми. Это значит, псевдо-элементов у нас тоже там нет. Впрочем, они вполне себе неплохо оформляются и как вещь в себе работают сносно: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/button

И вот, button. Что же с ним может быть не так, что нам потребуется нечто с role=“button”?

Давайте с очевидного: валидатор запрещает иметь div внутри button.

Выражаясь языком спецификации, button ожидает фразовый контент, а не потоковый: https://caninclude.glitch.me/can/include/?child=div&parent=button

То есть речь идёт не только о div, а ещё о десятке тегов. В итоге официально вкладывать можно практически один лишь span. Наверное, это не всем и не всегда удобно.

Впрочем, браузеры такой трюк позволяют.

Но если вам не всё равно — добавьте role=“button” и tabindex на любой удобный вам элемент, чтобы превратить его в интерактивный. Валидатор и скринридеры будут довольны. А ещё старые Safari, которые не умеют во flexbox на кнопках.

Мы у себя в дизайн-системе назвали такой компонент PlainButton, вот иногда ну надо.

Второй же случай посложнее.

Есть такой вид кнопок, toggle-кнопки. Переключатели. Это не checkbox, это не switch. Это просто что-то, что можно «зажать» сейчас и «отжать» потом. Например, кнопки в текстовом редакторе.

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

Почему это не чекбоксы? Потому что это не волеизъявление (согласие на что-то) как таковое, это просто некое действие, влияющее на что-то в приложении. Почему не свитчи? Потому что мы ничего не включаем физически. Кажется, об этих концептах стоит потом подробнее написать 😅

В общем, если вы подменяете логику работы кнопки с моментальной реакции на что-то иное вроде toggle, вам необходимо отдельно указать как минимум два необходимых атрибута: role=“button” и aria-pressed. Это же касается, например, кнопок открытия аккордеонов. Вот только вместо pressed нужно будет устанавливать expanded: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/button_role

Да, это всё поначалу кажется ненужным усложнением, но поверьте: в большом приложении информация лишней не бывает. Особенно если она поможет кому-то вашим приложением пользоваться. А заодно легче отлаживать и хранить состояние.

#button #a11y #role #toggle #бородач

Читать полностью…

Будни разработчика

Яндекс в последнее время очень активно внедряет нейросети в свои сервисы и продукты – ещё недавно, казалось бы, набирали AI-тренеров для обучения YandexGPT, а уже выпустили облегчённую нейронку третьего поколения YandexGPT 3 Lite.

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

Чтобы добиться таких результатов, YandexGPT 3 Lite прошла через несколько этапов обучения: претренинг и выравнивание вместе с обучением на основе вознаграждения. Здесь ребята добавили GQA и прокачали отдельную reward-модель, чтобы нейронка быстрее адаптировалась к новым условиям и принимала более точные решения. В случае таких специализированных архитектур нейронных сетей reward-модель играет ключевую роль — дообучение делает её более устойчивой к ошибкам и способной работать в различных сценариях. 

#YandexGPT #AI #технологии #бизнес

Читать полностью…

Будни разработчика

🚀 Поднимите свой опыт frontend-разработки на новый уровень.

👉 Приглашаем на вебинар: "Преимущества семантической верстки"

На открытом уроке вы получите ценные знания:
- Семантические теги: изучите строительные блоки HTML5.
- Влияние на сайт: постигните, как правильное использование тегов улучшает SEO и доступность сайта.
- Применение на практике: получите навыки, которые сможете применять в реальных проектах.

👩‍💻 Наш спикер, Анна Русяева – опытный веб-разработчик, поделится с вами лайфхаками и секретами мастерства.

📆 4 июня, 19:00 мск - отметьте дату в своем календаре!

🔑 Специальная цена на курс «Fullstack developer» для участников - расширьте свои возможности в IT с уникальным предложением.

=======
✨ Не упустите возможность! Регистрируйтесь сейчас https://vk.cc/cxedcA?erid=LjN8Jyg72 
=======

🎁 Все участники online-трансляции получат в подарок 3 бесплатных урока, и полезные материалы для начинающих.

Реклама. ООО "ОТУС ОНЛАЙН-ОБРАЗОВАНИЕ". ИНН 9705100963.

Читать полностью…

Будни разработчика

#автор дня

Сегодня у моей дочки день рождения — целых три года :)

Потому сил моих хватает только познакомить вас с замечательным автором — Тиффани Чонг и её потрясающим анимешным CSS-артом: https://codepen.io/tiffachoo/pens/public

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

Не кукситесь, котаны :)

#css #art

Читать полностью…

Будни разработчика

Фронтенд в картинках — просто, наглядно и понятно. Новые знания в компактном формате каждый день.

Присоединяйтесь: @FrontendPortal

Читать полностью…

Будни разработчика

Вжух — и каналу шесть лет! 6️⃣

Я на такое не рассчитывал, когда менял uppercase hex на lowercase :)

То сообщение имеет номер два. Не уверен, что было в первом.

Спасибо, котаны, за поддержку! Я знаю, тут есть те, кто чуть ли не с самого начала.

Всем хорошего лета, впереди ещё много всего!

Читать полностью…

Будни разработчика

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

P. S. не уверен, что вам нужен был ещё один пост про Docker в РФ ...

Читать полностью…

Будни разработчика

#баг дня

Вроде мы все с вами знаем, что CSS — отвечает за представление контента, никак его не модифицируя. И это подтверждается спецификацией во многих местах.

Вот только если ты пойдёшь и скопируешь в Chrome текст, на который наложен text-transfrorm: uppercase, скопируются заглавные буквы!

Но это неправильно: спека.

В общем, в Chrome 127, благодаря разработчикам из Microsoft, это будет исправлено.

Мне нравится путь, которым разрабы Edge выбрали пиар своего браузера: исправление старых багов и работа на девтулзами.

Ну и ссылка на баг: https://chromium-review.googlesource.com/c/chromium/src/+/5399744

Такой же баг присутствует в Safari, Firefox же отрабатывает ок. Думаю, код этой части CSS в Blink довольно старый, потому можно ожидать, что в Safari и WebKit будет бэкпорт.

#bug #chrome #css

Читать полностью…

Будни разработчика

#такое дня

Теперь, когда вас попросят на собеседовании написать код, который выводит сам себя — вы знаете, что делать:

($=_=>`($=${$})()`)()


Послать нафиг, конечно же

#js #бородач

Читать полностью…

Будни разработчика

#ретро дня

В комментариях к предыдущему посту встал вопрос: "А как тестировать Safari в Windows и Linux?"

Что ж, на этот вопрос есть частичный ответ. И пару лет назад я делал серию постов, посвящённую этой проблеме.

TL;DR: Safari не единственный браузер на WebKit, есть ещё Epiphany aka GNOME Web. И если на Linux он вполне себе нативно запускается, то на Windows нужно немного плясок.

Собственно, посты из серии:

Краткая история Safari: /channel/htmlshit/704
Установка GNOME Web на Windows WSL2: /channel/htmlshit/709
Использование WebKit Demo Browser через Playwright: /channel/htmlshit/714
Просто готовая сборка WebKit: /channel/htmlshit/715

Если кто попробует и дополнит инструкцию — я буду очень рад 🥺

P. S. там же есть инфа, как получить бесплатный доступ к сервису Browserstack: /channel/htmlshit/718

Читать полностью…

Будни разработчика

Открытый курс по JavaScript запустила команда AvitoTech (а это уже гарантия качественного контента).

• Для всех уровней разработки (но с базой в программировании будет попроще)
• Доступным языком
• Про JavaScript / HTML / CSS

Первый выпуск посвящён базовым понятиям: технология веба, браузер, клиент, сервер. Лекция уже доступна на канале AvitoTech.

Смотрите, это бесплатно!

Читать полностью…

Будни разработчика

#статья дня

Я много раз начинал и забрасывал статью о том, как справляться с рутиной. Но писать статью — это не в чате «деда» включать. Всё-таки важная штука — аудитория.

Впрочем, здесь мне помогут Александр Беспоясов, Вадим Юмадилов и Андрей Романов. Фамилия Беспоясова должна быть вам знакома – он отметился в Солидбуке.

Итак, какие вопросы разбираются в их лонгриде Фронтенд — это не больно:
— Как решать задачи, а не писать код
— Как не умереть в пиксель-перфекте
— Как вести диалог с дизайнерами

Можно, конечно, просто посоветовать перестать ныть и начать вникать, но это будет слишком грубым описанием этой прекрасной работы.

И обязательно обратите внимание на прикреплённые к статье материалы. В них есть всё.

#work #frontend #psychology #бородач

Читать полностью…

Будни разработчика

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

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

➡️ О практических рекомендациях по работе с S3-хранилищем читайте в полной версии статьи.

#yacloud_articles

Читать полностью…

Будни разработчика

#инструмент дня

React Compiler, говорите...

А что если я скажу вам, что есть инструмент, конвертирующий ваши JSX-компоненты во... во все остальные?

Буквально: JSX/Svelte в: React, Svelte, Vue, Angular, Qwik, Lit, Solid, Preact...

Давайте просто сразу дам ссылку на песочницу: https://mitosis.builder.io/playground/

Если уж и не для практического применения, но если вдруг надо срочно пересесть на другой фреймворк — то понять принципы можно с лёгкостью.

Знаешь JSX или Svelte — пишешь на всех :)

#framework #tool

Читать полностью…

Будни разработчика

Чтобы быть продуктивным, разработчик должен кодить быстро. 
Даниил Лихачев, Python-разработчик крупного диджитал-продакшена Далее, подготовил 5 способов? помогающих научиться кодить в 2,5 раза быстрее. Полную статью читайте на Хабре, а в этом после — краткая выжимка. 

Подписывайтесь на канал Далее ). Каждую неделю мы постим проверенные советы разработчиками другим диджитал-специалистам, чек-листы и вакансии 🖖

Читать полностью…

Будни разработчика

#ссылка дня

Итак, в чатике пару дней назад поднялся срачик состоялось некоторое обсуждение.

Темой этого самого обсуждения стало автоматическое воспроизведение видео со звуком на сайтах. Насколько нам всем известно, это с некоторых пор практически невозможно: только после явного действия пользователя.

Но коллега утверждал, что можно и в доказательство приводил Reddit. Естественно, никто повторить не мог.

Пришлось — кто бы мог подумать — обратиться к документации!

Итак, смотрим: https://developer.chrome.com/blog/autoplay

И что же это мы такое видим?

— On desktop, the user's Media Engagement Index threshold has been crossed, meaning the user has previously played video with sound.

Что ещё за индекс вовлечённости такой?!

Это что же получается, я смотрю недостаточно мемов на реддите?!

И таки да, внизу имеется расшифровка. Самый простой способ посмотреть её результаты — это открыть страницу about://media-engagement в Chrome.

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

#chrome #media #sound

Читать полностью…

Будни разработчика

#заметка дня

Рубрика "Вы не спрашивали, но я всё равно отвечу!"

На самом деле, разговор произошёл в Твиттере, и я посчитал разумным, вынести его сюда.

Итак, вопрос:
Что бы убедиться: использование testid в end-2-end тестах для выборки элементов это анти-паттерн, верно? Следует тестировать с точки зрения пользователя: искать кнопку с неким текстом, например.

Знаете ли вы статьи или доклады, которые подкрепляют эту точку зрения?

Отвечаю:
Это не то чтобы антипаттерн, это просто бестолковое использование ресурсов, потому и продвигается как антипаттерн.

1. Надо тестировать то, что видит юзер
2. Если что-то не видит, значит, всё плохо
3. Если там иконка или нужен результат — искать надо по a11y атрибутам.

Сразу поясню за "бестолковость".

Когда ты что-то тестируешь, тесты становятся твоей документацией. Значит, в тестах закрепляется текущее поведение проекта. Даже строки не стоит импортировать (если ты только не тестируешь систему перевода).

А это значит, если кто-то случайно сломает систему перевода или неправильно переведёт строку без информирования остальных — тесты упадут и это правильно.

Дальше, решая проблему через ARIA-атрибуты, ты заодно решаешь вопрос доступности. Бесплатно. Поэтому data-testid и названы бестолковым использованием ресурсов.

Это же, кстати, касается систем трекинга вроде Datadog RUM.

Смысл фронтенда в том, чтобы пользователь мог с продуктом взаимодействовать. Для этого необходима визуальная и когнитивная поддержка. Кнопка может быть и видна, но на кнопке — упс — может не быть текста. Или она будет цвета фона (потому скриншот-тесты ещё не вымерли).

Подобный подход к тестировани применяется как в E2E, так и в юнит- и интеграционном тестировании. Вот, например, поясняющая статья от Testing Library, которая нынче стандарт де-факто для тестирования в вебе.

Тестируйте, котаны!

#web #testing #e2e

Читать полностью…

Будни разработчика

#баг дня

Сегодня Chrome 125 принёс шикарное.

В погоне за поддержкой CSS Popup Anchor Positioning API они совсем позабыли о, собственно, правильном назначении этих самых якорей.

Вспоминаем, что видеоплеер работает в Shadow DOM и получаем поведение с иллюстрации.

Ссылка: https://issues.chromium.org/issues/341741271

Скоро поправят в Canary. Надеюсь, будет бэкпорт.

#css #popup

Читать полностью…

Будни разработчика

#фишка дня

Накидали секций, поставили к ним якоря, поставили ссылки вида #anchorName в навигацию, включили scroll-behavior: smooth; чтобы плавненько все было и...

...и ваша секция уехала под шапку ко всем чертям. Что же делать?

Спокойно. Есть три варианта.
1. Если ты живешь в 2012, можно подвинуть якорь вверх с помощью position: relative и отрицательного top. Или всячески играть полями. Но мы живем в 2024, так что...
2. scroll-padding-top на html (а часто, на родителя секций) или...
3. scroll-margin-top на любую из секцию, за которой якорь закреплен.

В чем отличие 2 от 3?

Ну, очевидно, в области применения. Разом на всех во 2 случае или индивидуально в 3.

Важно понимать, что на обычный скролл это не распространяется. Только якоря или snap: https://getpublii.com/blog/one-line-css-solution-to-prevent-anchor-links-from-scrolling-behind-a-sticky-header.html

#css #scroll #snap #anchor #бородач

Читать полностью…

Будни разработчика

#заметка дня

Когда Ахмад Шадид выступал у нас с Defensive CSS, возникла забавная проблема.

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

Алгоритмы видео Google Meet сильно режут контраст. В итоге разницы между акварельным голубым и акварельным розовым вообще не было заметно. А это были ключевые моменты примеров.

Думайте об этом выбирая цветовую гамму проекта. Ведь бывают и просто плохие дисплеи.

Вспомнил я про эту особенность потому что мне на глаза попалось огромное количество статей о неоморфизме. История циклична.

А неоморфизм он весь состоит из мягких теней, формирующих объём. Их точно так же не видно при плохом контрасте.

Хорошо, что некоторые статьи об этом все же упоминают: https://refine.dev/blog/neumorphic-css/

Так что не жалейте контраста. Оставьте акварель художникам.

#бородач

Читать полностью…

Будни разработчика

Кыргызы против Intl.NumberFormat

Когда лучшее враг хорошего.

Недавно к нам в команду web platform в aviasales пришли из техподдержки со странным багом у пользователя: в Arc браузере сломано отображение символа валюты кыргызских сомов, вместо него выводится непонятный символ. Проще всего конечно было ответить, что браузер не поддерживается, но стоп, разве арк не на хромиуме, чем он такой особенный?

Начал разбираться

Действительно, в обычном хроме сомы показываются как KGS, а в арке как символ, и символ явно ошибочный.
Для отображения валют мы используем стандартный Intl.NumberFormat и в арке он действительно выдаёт другой символ. Начало проясняться. Возможно, арк использует новую версию хромиума и поэтому показал проблемы раньше? И действительно, Chrome Canary получил точно такой же баг. Получается, совсем скоро, валюта сломается у всех, вообще у всех сайтов и пользователей страны, и отсчёт времени уже пошёл 🫠

Куда отправлять баг? У хромиума есть свой баг трекер, но работа с ним оставляет желать лучшего, выглядит он мягко говоря антично. Никогда не заполнял баги для браузера, но видимо этот час настал. В процессе подготовки репорта вспомнил, что вообще говоря, локализациями занимается не хромиум а отдельная библиотека ICU, то есть проблема ещё глубже, чем просто баг браузерного движка. А, казалось бы, невинная проблема

Описываю свои приключения коллегам, один замечает, что это первый раз, когда мы нашли баг не в самом лучшем браузере safari а в хроме, теперь счёт багов 4:1 в пользу первого. А действительно, а как себя ведёт в таких условиях сафари? Открываю. Встречаю тот же баг 🫡

Очевидно, проблема на уровне операционной системы.

Решил присмотреться к символу внимательнее, это просто мусорный вывод или он имеет какую-то семантику?

Символ который выдаётся на macos выглядит так: ⃀, если вы читаете с macos то почти наверняка ничего не увидите (в первом комментарии скриншот как это рендерилось в реальности). В базах данных по юникоду описание: Unicode Character 'SOM SIGN'. Бинго. Это не баг, это настоящий символ валюты, но в стандартных шрифтах macos его нет, на windows всё отображается нормально

В итоге получается ситуация: раньше вместо символа валюты выдавалась аббревиатура, библиотека ICU исправила эту проблему чем ухудшила вывод на девайсах apple

Это многое говорит о нашем обществе

Issue в багтрекере хрома или ICU открывать не стал. Очевидно они всё сделали правильно; парадоксальная ситуация в которой никто толком не виноват. Ну, точнее, можно конечно попинать apple чтобы добавляли символ, но это всё равно что орать на баобаб

Оценив диспозицию, решил что надёжнее всего будет просто сделать .replace для проблемного символа на старый вариант.
Мимоходом заметил, что в некоторых других условиях у нас на сайте кыргызская валюта отображается нормально. Оказалось, что вместо официального символа используется юникод-комбинация c + нижнее подчеркивание под символом: c̲. Как говорится c̲мекалочка ок. Но чтобы я не сильно радовался, оказалось, что в том самом стандартном шрифте apple этот символ тоже отображается криво, проще заменить обратно на KGS, как это было раньше и всех устраивало

Когда я заходил на эту пятничную задачу последнее чего я ожидал это изучения багтрекера браузеров. А вот проблемы с apple наоборот вполне были в рамках! Разумеется это ценно, что у движка chromium есть конкурент который не живёт на пособиях гугла, но нельзя не признать, что девайсы apple и веб разработка это головная боль. Всегда.

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

Читать полностью…

Будни разработчика

Frontend Developer — это первоисточник всего, что происходит во Frontend-сообществе

Здесь опытный Senior-разработчик ежедневно публикует материалы, которые накопил за 9 лет Frontend-разработки:

Шаблоны с готовым кодом для твоих проектов

Вопросы с собеседований, задачи и викторины

Шпаргалки по JavaScript, HTML и CSS

P.S. Даже онлайн-школы берут материалы с этого канала🤫

Читать полностью…

Будни разработчика

#новость дня

В этот день 11 лет назад React стал публичным открытым проектом.

С чем нас всех и поздравляю.

Делитесь, кто когда начал с ним работать. Я — аж летом 2018, написал на нем проект для Oreo.

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

А до того — Ember был единственной любовью.

У вас как?

Читать полностью…
Subscribe to a channel