Pull to refresh
1
0
Михаил Ураков @MikUrrey

PHPекарь и JavaScriptизёр

Send message

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

Reading time8 min
Views184K

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

Народ жалуется на Tinkoff, Альфа-банк и прочие банки, на операторов сотовой связи. Портал banki.ru ввёл драконовские правила, что у него решения судов без оценок в народном рейтинге, на форуме нельзя написать, что itsoft выиграл дело у ВТБ — это реклама itsoft видите ли, то есть видно надо писать одна компания, но не скажем какая выиграла суд у ВТБ.

В статье “Банки не хотят внедрять многофакторную авторизацию и покончить с мошенничеством” есть простые рецепты, которые бы исключили случаи мошенничества хотя бы для тех, кто не разговаривает с мошенниками и не сообщает им коды. Народ хочет аппаратные токены, а банки не дают. 

К написанию данной статьи меня ещё подвиг наш конфликт с хостером Leaseweb. 7 лет мы платили одну цену в месяц за аренду серверов там. А потом она внезапно выросла в 70 раз. Leaseweb решил, что за действия злоумышленников деньги надо списать с нашей корпоративной карты.

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

Читать далее
Total votes 162: ↑142 and ↓20+159
Comments210

JavaScript: заметка о requestAnimationFrame и requestIdleCallback

Reading time10 min
Views50K


Привет, друзья!


Можете ли вы ответить на вопрос о том, в чем заключается разница между requestAnimationFrame и requestIdleCallback?


Если можете, то я завидую глубине ваших знаний. Я не смог, когда меня об этом спросили. Более того, в тот момент я даже не знал о существовании интерфейса requestIdleCallback. Теперь знаю и хочу с вами этими знаниями поделиться.


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


Что касается поддержки, то с requestAnimationFrame все хорошо, а с requestIdleCallback, в основном из-за Safari, этого современного IE, ситуация хуже.


Рассматриваемые интерфейсы позволяют разработчикам получать доступ к процессу рендеринга страницы. Также они очень тесно связаны с циклом событий (event loop) браузера.

Читать дальше →
Total votes 18: ↑18 and ↓0+18
Comments6

12 инструментов и сайтов для UI/UX дизайнеров

Reading time2 min
Views62K
Инструменты для разработки постоянно совершенствуются как с точки зрения удобства использования, так и с точки зрения пользовательского опыта. Это очень удобно и для дизайнеров, и для пользователей. Не удивительно, что опытные веб-дизайнеры стараются идти в ногу со временем и изучают новые инструменты. Авторы сотен блогов и сайтов, посвященных дизайну, регулярно публикуют новые статьи, делятся своими знаниями и дают свои рекомендации по использованию новых инструментов. Для дизайнера все это является очень полезным источником информации. Мы тоже подобрали самые последние инструменты и веб-сайты для дизайнеров.

image

Читать дальше →
Total votes 34: ↑25 and ↓9+16
Comments1

Как работает JS: отслеживание изменений в DOM с помощью MutationObserver

Reading time7 min
Views54K
Сегодня, в переводе десятого материала из серии, посвящённой особенностям работы механизмов JavaScript, мы расскажем о том, как отслеживать изменения в DOM с помощью API MutationObserver.

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



Всё это ведёт к усложнению задачи контроля состояния интерфейсов приложений в процессе их жизненного цикла. Эта задача становится ещё масштабнее в том случае, если речь идёт о разработке чего-то вроде фреймворка или даже обычной библиотеки, когда, например, нужно реагировать на то, что происходит со страницей и выполнять какие-то действия, зависящие от DOM.
Читать дальше →
Total votes 24: ↑22 and ↓2+20
Comments7

Благодаря WebAssembly можно писать Frontend на Go

Reading time9 min
Views23K
Оригинал статьи.

В феврале 2017 года член команды go Brad Fitzpatrick предложил сделать поддержку WebAssembly в языке. Спустя четыре месяца в ноябре 2017 автор GopherJS Ричард Музиол начал реализовывать идею. И, наконец, полная реализация была смержена в mаster. Разработчики получат wasm примерно в августе 2018, с версией go 1.11. В результате, стандартная библиотека берёт на себя почти все технические сложности с импортом и экспортом функций, знакомых вам, если вы уже пробовали компилировать Си в wasm. Звучит многообещающе. Давайте посмотрим, что можно сделать с первой версией.
Читать дальше →
Total votes 20: ↑17 and ↓3+14
Comments93

Производительность анимаций на сайтах

Reading time14 min
Views21K

image


При разработке сайтов, выходящих за рамки условного бутстрапа, рано или поздно возникают вопросы, связанные с производительностью анимаций. Особенно важными они являются в дизайнерских сайтах, вроде тех, что попадают в каталоги Awwwards, FWA, CSS Design Awards и.т.д. При этом часто задача создания анимаций и последующей оптимизации, если она будет нужна, ложится на плечи не очень опытных разработчиков, которые даже не знают с чего начать. Обычно все это выливается в тормозящие сайты, которыми невозможно пользоваться, и последующее негативное отношение ко всему классу таких проектов. В этой статье мы постараемся разобрать, где находится граница приемлемой производительности анимаций, какие узкие места часто встречаются и куда смотреть в инструментах разработчика в первую очередь.

Total votes 14: ↑14 and ↓0+14
Comments3

Работаем с аудио: прогресс и визуализация данных

Reading time6 min
Views17K


Доброго времени суток, друзья!

Хочу поделиться опытом работы с аудио. Под «аудио» я подразумеваю HTMLAudioElement и Web Audio API.

Что будем делать?

Мы создадим нечто вроде плеера для одного трека (о полноценном проигрывателе — в одной из следующих статей).

Условия:

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

В сети полно материалов как по HTMLAudioElement, так и по WAAPI, поэтому я сделаю акцент на практической составляющей. Кроме аудио, мы будем работать с drag-drop и canvas.

Без дальнейших предисловий…
Читать дальше →
Total votes 14: ↑14 and ↓0+14
Comments12

Концепции, лежащие в основе Web Audio API

Reading time9 min
Views8.1K


Доброго времени суток, друзья!

В этой статье объясняются некоторые концепции из теории музыки, на основе которых работает Web Audio API (WAA). Зная эти концепции, вы сможете принимать взвешенные решения при проектировании аудио в приложении. Статья не сделает вас опытным инженером по звуку, но поможет понять, почему WAA работает так, как работает.
Читать дальше →
Total votes 13: ↑13 and ↓0+13
Comments0

Пробуем Audio API на примере написания визуализатора

Reading time6 min
Views51K

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

Но прежде чем начать разбираться непосредственно с Audio API, нам необходимо набросать заготовку нашего визуализатора и делать мы будем это при помощи canvas.

Подробности
Total votes 32: ↑31 and ↓1+30
Comments13

Эквалайзер на JavaScript

Reading time5 min
Views57K
На хабре уже было несколько статей по Web Audio API: создание визуализатора, вокодера и пианино в 30 24 строки. Поиск же по всея интернетам по запросу эквалайзер упорно выдавал туториалы по созданию спектрограмм. (Если заголовок этой статьи сбил вас с толку или вы таки купились на картинку:) и ожидали именно визуализации аудио — вам сюда или вот сюда). Но именно просто эквалайзера я так и не встретил (хотя уверен, что где-то он таки есть). Возможно, это настолько простая задача, что об этом и писать не стоит. Но, в таком случае, почему бы не сделать её ещё проще?


Читать дальше →
Total votes 44: ↑39 and ↓5+34
Comments21

GitFlic: нас обвинили в «распиле» — мы не поняли почему, но посмеялись

Reading time8 min
Views16K

Здравствуй, читатель!

"...Российский GitHub..." - за такую фразу в заголовке на Habr'e однажды зацепился мой взгляд. С предвкушением я нырнул под кат и... Увы, обнаружил лишь поверхностный обзор, щедро сдобренный издёвкой и скриншотами. Но, согласитесь, ведь не каждый день на горизонте событий возникает что-то IT-шное с припиской "российский", посему любопытство грубо вытолкало меня из раковины интроверта и заставило обратиться напрямую к наиболее надежному источнику - команде сервиса GitFlic.

Читать далее
Total votes 66: ↑20 and ↓46-20
Comments117

Несколько малоизвестных возможностей docker-compose

Reading time5 min
Views28K

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


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

Читать дальше →
Total votes 51: ↑49 and ↓2+47
Comments22

Nuxt as fullstack server: frontend + backend API Server (Часть 1)

Reading time6 min
Views26K
Nuxt as fullstack server: frontend + backend API Server


Разработчики Nuxt предлагают 3 метода доступа к API:

  1. Встроенный в Nuxt сервер Connect и использование serverMiddleware
  2. Интегрированные фреймворки (Express, Koa, Hapi и т.д.)
  3. Внешние API сервера

Я покажу на простом примере как организовать API сервер с использованием serverMiddleware на том же инстансе Nuxt, который у нас отвечает за frontend.
Читать дальше →
Total votes 7: ↑6 and ↓1+11
Comments3

Additional SSR performance with Nuxt fullstack server (Часть 2)

Reading time5 min
Views8.7K
Additional SSR performance with Nuxt fullstack server


В Части 1 я рассказал как легко организовать API Server в Nuxt. В Части 2 я хочу рассказать какие дополнительные преимущества можно извлечь из Nuxt fullstack server.
Читать дальше →
Total votes 9: ↑9 and ↓0+9
Comments4

Как я сделал удобной разработку на Vue.js с server-side рендерингом

Reading time10 min
Views37K
Всем привет!

Начну с небольшой предыстории.

Свой новый проект я решил попробовать сделать на Vue.js. Мне нужен был серверный рендеринг (SSR), CSS модули, code-splitting и прочие прелести. Разумеется, для повышения производительности разработки нужна была горячая перезагрузка (HMR).

Я не хотел использовать готовые решения, типа Nuxt.js, т.к. при разрастании проекта важно иметь возможность кастомизации. А любые высокоуровневые решения, как правило, не дают этого делать, или дают, но с большими усилиями (был похожий опыт с использованием Next.js для React).

Основная проблема локальной разработки при использовании серверного рендеринга и горячей перезагрузки состояла в том, что мало запустить один webpack-dev-server. Мы должны также что-то сделать с исходниками, которые запускает Node.js, иначе при следующей перезагрузке страницы мы получим код, который не был обновлен на сервере, но обновился на клиенте.

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


Читать дальше →
Total votes 25: ↑24 and ↓1+23
Comments11

Information

Rating
Does not participate
Location
Россия
Registered
Activity