#фишка дня

Чота меня подзадолбало писать try-catch на каждый async-await вызов.

С “cырыми“ промисами как-то… чище на уровне синтаксиса: then-catch и всё.

Но вот тут пригодились тестовые задания на собеседованиях. У одного инженера я увидел подход, что на иллюстрации. Очень похоже на то, как возвращаются ошибки в Go.

В общем, я почитал об использовании такого подхода и остался доволен.

P. S. конечно, есть и другие примеры: https://gist.github.com/fnky/0a6cd5f39a7ad0ace79a7a4f5c999691

#js #async #await #promise #error #typescript

#фишка дня

Чота меня подзадолбало писать try-catch на каждый async-await вызов.

С “cырыми“ промисами как-то… чище на уровне синтаксиса: then-catch и всё.

Но вот тут пригодились тестовые задания на собеседованиях. У одного инженера я увидел подход, что на иллюстрации. Очень похоже на то, как возвращаются ошибки в Go.

В общем, я почитал об использовании такого подхода и остался доволен.

P. S. конечно, есть и другие примеры: https://gist.github.com/fnky/0a6cd5f39a7ad0ace79a7a4f5c999691

#js #async #await #promise #error #typescript

#фишка дня

Итак, сегодня в уютный канальчик™️ с ноги залетает уже всем известный Джей c кое-чем насколько потрясающим, настолько же и забытым.

И это API document.getAnimations(), позволяющий не только получить список всех CSS-анимаций, но и, внимание, выставить промис и дождаться их выполнения! 🤯

const animations = document.getAnimations()
.map(a => a.finished)
await Promise.all(animations)

Сразу кодпен: https://codepen.io/alinaki/pen/rNoEOwX

*с некоторых пор я начал форкать пены, потому что пропадают иной раз

Теперь о применимости.

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

Ну а разработчикам промо-сайтов важность синхронизации действий и анимаций объяснять не надо.

Отличный пример забытых технологий 🙂

Не, ну серьёзно, оно с 75 Firefox доступно, как я мог его проглядеть?

А я знаю, как. Я же писал уже, что PR-служба Chrome работает прекрасно только в том случае, когда что-то появилось там первым...

#css #js #animations #promise

#баг дня

Итак, вы что-то продаёте на своём сайте, услугу или товар, используя Stripe.

inb4 я в курсе, что большинство подписчиков из РФ и Stripe там не работал никогда, но мой поинт не в этом, принцип работы платёжных систем на клиенте одинаков.

Тут вы замечаете, что 1-2% пользователей не могут завершить покупку. И никак не можете понять, что же не так. И всё как-то нестабильно при этом... то могут, то не могут.

В какой-то момент до тебя доходит, что проблемные пользователи сидят на нестабильном интернете или за VPN. Включаешь Throttle на вкладке Network — и, чудо, повторяешь проблему!

Не очень понятно, почему сразу нельзя было залезть на гитхаб официальной клиентской библиотеки, но выясняется, что проблема стара как говно мамонта, сразу даю ссылку на повтор: https://github.com/stripe/stripe-js/issues/26#issuecomment-1477716731

Конечно, если говну мамонта 4 года. Но это именно так в случае подобных библиотек.

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

Но, более того, загрузчик реализован таким образом, что если ты попытаешься реализовать повтор загрузки самостоятельно, у тебя не выйдет. Стоит получить "Error: Failed to load Stripe.js", поможет только перезагрузка страницы.

К счастью, Stripe, наконец, выпустила решение: https://github.com/stripe/stripe-js/pull/518

И оно потрясающе простое: удалить упавший промис и дать возможность создать его заново.

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

Да и PR достаточно прост, чтобы понять принцип работы подобных решений.

#stripe #promise #defer

#фишка дня

Итак, сегодня в уютный канальчик™️ с ноги залетает уже всем известный Джей c кое-чем насколько потрясающим, настолько же и забытым.

И это API document.getAnimations(), позволяющий не только получить список всех CSS-анимаций, но и, внимание, выставить промис и дождаться их выполнения! 🤯

const animations = document.getAnimations()
.map(a => a.finished)
await Promise.all(animations)

Сразу кодпен: https://codepen.io/alinaki/pen/rNoEOwX

*с некоторых пор я начал форкать пены, потому что пропадают иной раз

Теперь о применимости.

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

Ну а разработчикам промо-сайтов важность синхронизации действий и анимаций объяснять не надо.

Отличный пример забытых технологий 🙂

Не, ну серьёзно, оно с 75 Firefox доступно, как я мог его проглядеть?

А я знаю, как. Я же писал уже, что PR-служба Chrome работает прекрасно только в том случае, когда что-то появилось там первым...

#css #js #animations #promise #бородач

#фишка дня

Нужно отменить операцию по таймауту? Ни слова больше!

try {
  const res = await fetch(url, { signal: AbortSignal.timeout(5000) });
  const result = await res.blob();
  // …
} catch (err) {
  if (err.name === "TimeoutError") {
    console.error("Timeout: It took more than 5 seconds to get the result!");
  } else {
    console.error(`Error: type: ${err.name}, message: ${err.message}`);
  }
}

Я серьёзно сейчас: https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal/timeout_static

Концепция AbortSignal это вообще крутейшая тема, которая в целом не так давно ворвалась во фронтенд-разработку, рекомендую ознакомиться: https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal

#promise #timeout

#фишка дня

Итак, сегодня в уютный канальчик™️ с ноги залетает уже всем известный Джей c кое-чем насколько потрясающим, настолько же и забытым.

И это API document.getAnimations(), позволяющий не только получить список всех CSS-анимаций, но и, внимание, выставить промис и дождаться их выполнения! 🤯

const animations = document.getAnimations()
.map(a => a.finished)
await Promise.all(animations)

Сразу кодпен: https://codepen.io/alinaki/pen/rNoEOwX

*с некоторых пор я начал форкать пены, потому что пропадают иной раз

Теперь о применимости.

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

Ну а разработчикам промо-сайтов важность синхронизации действий и анимаций объяснять не надо.

Отличный пример забытых технологий 🙂

Не, ну серьёзно, оно с 75 Firefox доступно, как я мог его проглядеть?

А я знаю, как. Я же писал уже, что PR-служба Chrome работает прекрасно только в том случае, когда что-то появилось там первым...

#css #js #animations #promise #бородач