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

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

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

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

Будущее веба: станет ли рендеринг в <canvas> заменой DOM?

Время на прочтение7 мин
Количество просмотров25K
В последнее время было немало горестных рассуждений о последствиях решения Google использовать HTML-элемент <canvas> для рендеринга всего, что видно на экране при работе с Google Docs. И то, что это многих беспокоит, вполне понятно. Когда-то веб был задуман как система для работы с тщательно структурированной информацией, полной осмысленных метаданных и рассчитанной на совместное её использование многими людьми. Но, вместо этого, тот веб, который мы видим сегодня, представляет собой довольно сложно и запутанно устроенные приложения, которые работают в браузерных «песочницах».


Решение Google, которое заключается в том, чтобы перейти от вывода на страницы HTML-элементов к рисованию пикселей на <canvas>, нельзя назвать чем-то таким, чего раньше никто не видел и не пробовал. Другие передовые веб-приложения уже вышли далеко за пределы традиционных схем работы с HTML-элементами. Так, в Google Maps вывод данных на <canvas> используется уже многие годы. В VS Code для отрисовки идеального интерфейса терминала тоже используется <canvas>. А в подающем надежды наборе инструментов Google Flutter, который позволяет создавать кросс-платформенные интерфейсы, в веб-браузере, по умолчанию, используется рендеринг с использованием <canvas>.

Но в этот раз происходящее вызывает несколько иные ощущения. А именно, появляется такое чувство, что рендеринг в <canvas> и другие современные технологии, вроде WebAssembly, увели нас за точку невозврата. Все привыкли к схеме работы, когда страница загружает, в виде обычного текста, JavaScript-код, который выполняется, взаимодействуя с HTML-элементами, видимыми в «инструментах разработчика». Сейчас возникает такое впечатление, что это — лишь небольшой этап на пути постоянно развивающихся технологий веб-разработки.
Читать дальше →
Всего голосов 74: ↑72 и ↓2+70
Комментарии103

Длинная история про то, как мы веб-разработчика на фрилансерских сайтах искали, но так и не нашли

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

Понадобилось мне тут недавно фрилансера найти, чтобы вебсайт сделать. Казалось бы, и что тут такого? Уж кого-кого, а веб-девелоперов в стране хватает! За пару недель найду, - думал я, максимум за месяц. Как вы уже догадались, не нашел.

Этот лонгрид - о фрилансерах в частности, и немного о веб-разработке в целом, от лица заказчика. Я прекрасно понимаю, что большинство завсегдатаев Хабра - исполнители, а заказчикам тут периодически прилетает. И все же рискну высказаться.

Надеюсь, будет весело
Всего голосов 72: ↑70 и ↓2+68
Комментарии287

UML умер, а никто и не заметил?

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

UML, нам будет тебя не хватать

Unified Modelling Language (UML), разработанный Rational Software и принятый в качестве стандарта Object Management Group (OMG) в 1997 году, призван был стандартизировать множество различных типов графических нотаций, принятых в отрасли разработки ПО.

Моя история отношений с UML началась почти десяток лет назад, когда я стал евангелистом этого языка как моста между ИТ и бизнесом. Я никогда не был полностью убеждён в ценности UML как нотации для моделирования конкретных программных продуктов; моя цель заключалась в использовании UML для описания требуемых структурных и поведенческих свойств, ожидаемых от проектируемой системы.
Читать дальше →
Всего голосов 79: ↑72 и ↓7+65
Комментарии185

Как мы делали планшет

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

В 2018-м в Skyeng появились онлайн-занятия математикой. Так мы столкнулись с тем, что наша платформа, адаптированная под устный английский, не очень подходила для письменных занятий с дробями, формулами и геометрическими фигурами.

Читать далее
Всего голосов 133: ↑131 и ↓2+129
Комментарии84

Истории

PHP Дайджест № 204 (17 – 31 мая 2021)

Время на прочтение4 мин
Количество просмотров10K
Фото: Christian Münch.

В эти две недели core команда PHP активно обсуждала предложение по Partial function Application и в качестве альтернативы Никита Попов предложил более простой синтаксис для получения ссылки на любые функции. Также в уже принятые в PHP 8.1 енумы предлагается добавить статические свойства.

Symfony 6 будет требовать PHP 8.0, а вышедшая Doctrine 2.9 поддерживает указание метаданных в атрибутах вместо PHPDoc.

Еще в выпуске классная статья про регекспы и инструкция по использованию Deployer, а также другие полезные статьи, пачка инструментов, немного видео и подкастов.

Приятного чтения!
Читать дальше →
Всего голосов 51: ↑51 и ↓0+51
Комментарии23

Спаси котика из-под рояля

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

Вашему другу нужна помощь. Точнее, не вашему, а гипотетическому. Или даже не другу, а котику… хотя котик же не настоящий… Чёрт, короче! Наверняка у многих из вас в жизни была такая бывшая, расставание с которой было как закрытие ипотеки: «Господи, ну наконец-то!». И вот всё наконец-то закончилось, осталось только забрать свой ноутбук с очень важным NFT-токеном гифки с танцующим котиком. Этот котик дорог вам как память и как произведение цифрового искусства. Но ипотека теперь уже бывшая устроила в отместку целое шоу: протерла ноутбук от пыли, приготовила всё, чтобы залить его жидким азотом и подвесила над ним… РОЯЛЬ.
Спасти котика
Всего голосов 94: ↑77 и ↓17+60
Комментарии77

Сравнение производительности CSS и CSS-in-JS в реальном мире

Время на прочтение7 мин
Количество просмотров22K
Технология CSS-in-JS заняла прочное место среди инструментов фронтенд-разработки. И возникает ощущение, что CSS-in-JS-тренд в ближайшем будущем лишь усилится. Особенно — в мире React. Например, в исследовании State of CSS, проведённом в 2020 году, приняли участие 11492 человека. Лишь 14,3% из них не слышали о Styled Components (о ведущей CSS-in-JS-библиотеке). А вот пользовались этой библиотекой более 40% участников исследования.



Мне уже давно хотелось найти серьёзный материал, посвящённый сравнению производительности CSS-in-JS-библиотек, вроде Styled Components, и доброго старого CSS. Но я, к сожалению, ничего такого, вроде сравнения их производительности на реальном проекте, а не на каком-то простом наборе тестов, найти не смог. Поэтому я решил сам сделать такое сравнение. Я перевёл реальное приложение со Styled Components на Linaria, на библиотеку, которая выполняет извлечение CSS в файлы во время сборки проекта. В результате в приложении, использующем Linaria, не выполняется генерирование стилей во время работы этого приложения на компьютере пользователя.
Читать дальше →
Всего голосов 59: ↑59 и ↓0+59
Комментарии73

Я выпустил Grafar — JS-библиотеку для визуализации

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

После пяти лет в столе я готов представить свою библиотеку для визуализации — grafar. У нас есть: 3D, реактивные вычисления и самое простое АПИ для построения математических графиков прямо в браузере. В статье рассказываю, что я сделал и как этим пользоваться.

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

Вышел Bootstrap 5: оцениваем 7 главных нововведений

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

Пройдя через несколько альфа- и бета-версий, наконец-то появился Bootstrap 5, на что у разработчиков ушло несколько месяцев. Новая версия претерпела серьезные изменения, включая отказ от поддержки Internet Explorer (IE) и зависимости jQuery. От IE было решено отказаться, потому что браузер занимает всего 3% рынка и его доля продолжает снижаться.

Что такое Bootstrap? Это самый популярный в мире CSS-фреймворк с открытым исходным кодом, который разработан командой Twitter. В v5 внесено сразу несколько критически важных изменений, давайте посмотрим, что там и как.
Всего голосов 82: ↑76 и ↓6+70
Комментарии21

JavaScript-классы — это не просто «синтаксический сахар»

Время на прочтение6 мин
Количество просмотров28K
После того, как я прочитал очередную статью, где говорится о том, что JS-классы — это всего лишь «синтаксический сахар» для прототипного наследования, я решил написать материал, призванный (в который раз!) прояснить вопрос о том, почему данное утверждение неверно. Тут я, надеюсь, смогу объяснить разницу между JS-классами и прототипным наследованием, и смогу рассказать о том, почему важно понимать эту разницу.


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

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

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


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

Если вы давно хотели разобраться в CORS и вас достали постоянные ошибки, добро пожаловать под кат.

Ошибка в консоли вашего браузера


No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://example.com/

Access to fetch at ‘https://example.com’ from origin ‘http://localhost:3000’ has been blocked by CORS policy.


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

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

Но давайте-ка пойдем к истокам…
Читать дальше →
Всего голосов 59: ↑58 и ↓1+57
Комментарии14

Ретроностальгия: почему мой веб-сайт выглядит как Windows 9x

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


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

Что касается дизайна… то почему бы не отдать дань уважения одной из самых значимых операционных систем моей юности: Windows 9x. И почему бы ради забавы не сделать его таким, чтобы он умещался на дискете?
Всего голосов 58: ↑56 и ↓2+54
Комментарии46

Малоизвестные, но крутые атрибуты в HTML

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


Спросите случайного фронтендера, какие атрибуты HTML он использует — и услышите что-то вроде «src, href, style, class...» и прочую чепуху, которую всем ещё в младенчестве вживили на чипе агенты IETF. Между тем, стандарты веба не стоят на месте, и с каждым годом в браузерах появляются всё более крутые фичи не только для монструозного CSS, но и для обычных элементов HTML. Вы знали, что с помощью атрибутов можно пинговать* произвольный адрес, а элементы формы могут многократно переопределять её поведение? Вряд ли.
Всего голосов 67: ↑65 и ↓2+63
Комментарии15

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

Веб на заре Рунета. Как создавали и где хостили сайты в 90-е

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

Хоумпейдж мой, домашняя страница готова. Сайт я свой доделал, бабуля!

Удивительно, но я совершенно не помню день своего знакомства с интернетом. Это определенно был 1996 или 97-й год, но сам момент отчего-то не отложился в памяти: интернет вошел в жизнь нашего поколения исподволь, вытеснив из нее и BBS, и эхоконференции Фидонета. Поначалу мы отчаянно потребляли контент: серфинг по сети в середине 90-х напоминал путешествия Колумба в поисках неизведанного, и ежедневно приносил новые увлекательные открытия. Затем у многих тяга к творчеству брала верх, и они начинали робкие эксперименты по созданию собственных «кошмарных домашних страничек». Меня тоже не минула чаша сия — воспоминания о том, как это было, сейчас вызывают лишь ностальгическую улыбку.
Читать дальше →
Всего голосов 120: ↑117 и ↓3+114
Комментарии117

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

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

Бесплатное хранилище артефактов PackageCloud

Удивительно, но в интернете сотни сервисов, которыми разработчик может пользоваться совершенно бесплатно. «Бесконечное» время (пока компания не обанкротится или не изменит условия), без рекламы, пробного периода и других подводных камней.

Недавно мы обсуждали эту тему в статье «Боль разработчика: “Никогда не давайте пользователям бесплатный тариф”». Речь шла о том, что на самом деле бесплатный план вовсе не бесплатен — приходится тратить массу времени и усилий на поддержку этих тарифов.

Но для некоторых бесплатный тариф — единственный способ завлечь новых клиентов. Это просто замечательно с точки зрения самих пользователей. Ведь перед нами десятки бесплатных хостингов, API, CMS, CDN, сервисов обработки данных, поисковых движков, репозиториев, инструментов проверки кода и других. Бесплатный тариф идеален для опенсорс-разработчиков, любительских и некоммерческих проектов, маленьких стартапов. Ни за что не надо платить.
Читать дальше →
Всего голосов 83: ↑77 и ↓6+71
Комментарии15

«Я не робот»: история Яндекса о том, как победить ботов, а не людей

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

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

Чуть больше года назад моя команда взялась за модернизацию старой капчи Яндекса. Обычно в таких задачах стремятся повысить качество и полноту отсева ботов, оставив человеку шанс прорваться через капчу. Но мы зашли с другой стороны: решили сделать капчу более дружелюбной к людям, не ухудшив при этом защиту от ботов. Казалось бы, наивный подход. Но у нас получилось.

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

Я не робот
Всего голосов 94: ↑90 и ↓4+86
Комментарии123

Как создатель node.js сам разочаровался в нем

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

Несколько лет назад на JSConf 2018 выступил Райан Даль, создатель Node.js. Его доклад вызвал сенсацию, он затронул много актуальных проблем и поднял громкий хайп, не оставив равнодушным практически никого, кто связан с серверным программированием. В его обсуждении бэкэнд программисты разделились на два лагеря: одни отстаивали Node.js, другие прочили ему скорую смерть. 

С момента выступления Райана прошло немногим больше двух лет, а в IT это целая эпоха, за время которой может поменяться еще не все, то очень многое. Давайте вспомним этот доклад и попробуем посмотреть, что изменилось с тех пор, кто был прав.
Всего голосов 72: ↑62 и ↓10+52
Комментарии119

Вторая жизнь пыльного Андроида

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

Три мысли всё не давали мне жить спокойно:

1) есть ноутбук, но для работы нужен второй экран
2) давно мечтаю о пульте управления для Photoshop в дополнение к клавиатуре
3) на полках пылятся устаревшие гаджеты, которые продавать глупо, а выкидывать жалко

Решим одно за счёт другого
Всего голосов 77: ↑76 и ↓1+75
Комментарии94

Как ощутить «интернет 2000 года»

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

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

Все знают, что раньше интернет был попроще. Но часто ли вы вспоминаете, что во время его использования вся семья оставалась без телефонной связи? Помните ли встроенный в Opera баннер? Программы FlashGet и eMule? Вёрстку сайтов таблицами и фреймами? Штурмовые корабли в огне на подступах к Ориону? (Извините, увлёкся.)

По-моему, около 2000-го произошёл прорыв: в 90-х интернет был ещё гиковской историей, а в нулевых стал мейнстримом. Как можно сегодня ощутить времена этого прорыва? Увидеть старые сайты помогает Wayback Machine, но если делаешь это в свежем браузере через современное подключение, видишь только часть картины. Поэтому сделал подборку из информации, ссылок и советов, которые дополнят опыт. Те, кто постарше, ощутят ностальгию, а те, кто помладше, узнают что-то новое.

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

PHP 8 и развитие языка в 30 вопросах и ответах

Время на прочтение14 мин
Количество просмотров14K
В конце ноября мы провели стрим с Никитой Поповым и Дмитрием Стоговым, ключевыми контрибьюторами ядра PHP. За полчаса мы получили 100+ вопросов и ребята не успели ответить на все. Поэтому я сгруппировал оставшиеся сообщения по темам, отсеял совсем специфические и собрал ответы в текстовом виде. Все острые и холиварные вопросы оставил.



Готовя ответы, по многим пунктам я консультировался с Никитой и другими активными участниками сообщества. Кстати, в эту субботу, 27 февраля, мы проводим новый стрим! Будет пара докладов, несколько дискуссий, интересные гости и возможность задать новые вопросы. Читайте те, что под катом и подключайтесь, чтобы задать новые.
Всего голосов 64: ↑63 и ↓1+62
Комментарии21

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