Stalker_RED

Непонятно, зачем такая огромная картинка, и что именно вы хотели на ней показать.

У таба есть параметр url.

Если вы хотите дождаться открытия вкладки, то да, асинхронный код конечно надо писать, и он у вас даже есть.

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

Вот в этом табе и должен быть параметр url.

Вот еще всякое:
chrome.tabs.getSelected
chrome.tabs.getCurrent
chrome.tabs.get (по id)
chrome.tabs

На самом верхнем уровне вашего приложения должен быть какой-то Глобальный И Великий Обработчик Исключений Общего Назначения. Задачи у него очень простые - записать в лог что и где сломалось, показать пользователю табличку "ой, все пропало", и опционально пнуть мониторинг, отправить смс админу или письмо деду морозу.

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

Рассмотрим пару примеров:
1. Представим, что модуль "генератор превьюшек для фоточек", который верой и правдой трудился многие месяцы, однажды наталкивается на непреодолимую для него преграду и бросает исключение - "капец, место на диске кончилось, я так больше не работаю!"

Если ваш код не может ничего с этим поделать - вы пропускаете это исключение выше, пускай Глобальный И Великий Обработчик показывает юзеру красивую табличку "извините, у нас перерыв обед", и шлет письма админу в три часа ночи. А если у вас облачный хостинг, например, и вы можете на лету подключить больше дискового пространства, или может снести какой-то ненужный кэш освободив место, то можно перехватить это исключение, показать юзеру "извините, за задержку, ваши фоточки будут обработаны через пару минут", а админу прислать не красный алерт, а желтый.

2. Виджет, который показывает самых рейтинговых котиков с ютуба не смог подгрузить очередную порцию котиков, т.к. ютуб забанен роскомнадзором. Если ваш код ничего не может с этим поделать - Глобальный И Великий Обработчик Исключений покажет пользователю "ой все". Или вы перехватите это событие на более низком уровне и покажете табличку "свежих котиков нет, но вот есть рейтинг за прошлую пятницу". Или, если котики должны быть обязательно свежие, то можете предусмотреть экстренное подключение через vpn или tor, или может возьмете котиков с vimeo вместо ютуба, например.

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

Важно в этом не переусердствовать, и не основывать бизнес-логику на исключениях. Этот механизм для редких, исключительных ситуаций, которые не получается обработать другим способом. Если модуль ресайза фоточек написан индусами, и его, внезапно, нечем заменить. Но если есть возможность (и необходимость) перевести эту проблему из разряда исключительной в обычную рабочую ситуацию - лучше так и сделать. Если у вас место кончается два раза в неделю - лучше настроить какой-то мониторинг, который будет следить за этим показателем и заранее разруливать такие ситуации. В случае с недоступностью сервера можно на уровне бизнес логики проверять доступность и подключать резервные каналы или источники данных, вместо того, чтобы падать с ошибкой "ой 500!".

Это же базовый функционал html-форм.

Без регистрации, без СМС, и скриптов.

Потестить можно здесь: https://jsfiddle.net/z8555bpw/

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

getBoundingClientRect()

Возвращаемое значение — это объект TextRectangle, содержащий свойства только для чтения left, top, right и bottom, описывающие бокс с границами в пиксельном измерении. Значения top и left даются относительно верхнего левого угла порта просмотра.

Про вьюпорт неплохо описано здесь https://www.quirksmode.org/mobile/viewports.html
(там есть еще и вторая часть).

Самые азы не менялись. Спецификации в удобоваримом виде есть на MDN, там же ссылки на подробнейшие официальные спеки.

А крутые трюки в учебниках не пишут, за этим лучше в блоги и сайты типа css-tricks.

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

На serial порте почти любой конторллер подойдет. С usb чуть поменьше выбор, но есть готовые ардуинки с usb. Прицепить кнопку - два проводка, резистор и десяток строк кода из examples.

Останется только на стороне компа написать нечто, ожидающее команду (примеров тоже хватает).

Зачастую у слова бывает более одного значения, вот почему.


А если присмотреться к слову dispatcher и router, то можно найти у них что-то общее.

Он что-то там сравнивает и ищет совпадения, а потом что? Вызывает соответствующий модуль, и передает ему параметры, да?

Вот краткое описание
https://developer.mozilla.org/ru/docs/Web/HTML/Ele...

Там в разделе атрибутов описан и type в том числе.

И ссылки на спецификацию есть.

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

javascript:(function(){
  fetch("/save", { // адрес вашей "сохранялки"
    method: "POST",
    body: document.body.innerHTML
  });
})();

FormData и ajax (XMLHttpRequest или fetch).

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

Снизу псевдоэлемент с тенью, поверх него градиент полукругом.

.foo {
  position: relative;
  border: solid 1px gray;

  width: 50%;
  padding: .5em;
  background: white;
}
.foo:after {
  content: '';
  position: absolute;
  left: 2%; right: 2%; bottom: -21px;
  height: 20px;
  background: radial-gradient(circle at bottom, white 65%,transparent 100%);
  z-index: -1;
}
.foo:before {
  content: '';
  position: absolute;
  left: 2%; right: 2%; bottom: 0px;
  height: 10px;
  box-shadow: 0px 0px 25px 5px rgba(0,0,0,0.85);
  z-index: -2;
}

https://jsfiddle.net/vgj0mp99/
точные циферки подбирать лень.

array_chunk() чтобы разбить на части.
foreach по этим частям, каждую оборачиваем в группу, и выводим элементы.

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

Совсем круто - проверять еще и на слабом компе. Не у всех посетителей вашего сайта топовое железо, особенно сильно это телефонов касается.

Для того чтобы оператор ИЛИ вернул true достаточно, чтобы выполнилось любое из условий. Когда одно из условий выполнилось, то что записано левее - не проверяется.

Но вы можете в скобки обернуть

if ( (условие1 ИЛИ условие2 ИЛИ условие3) И условие4) { . . . }