wadowad

Лучше всего, когда документ не встроен в сайт, а открывается в отдельной вкладке при переходе по ссылке. То есть достаточно просто ссылки на pdf-файл. Тогда он и крупный, и адаптивный. В общем, плюсы такой интеграции очевидны.

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

Вот пример на jquery. Любой JSON -> в HTML table

Вам нужно после каждой правки CSS или JS в url файлов нужно добавлять версию, например
https://www.site.ru/js.js?ver=3.6.0

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

https://www.site.ru/style.css?ver=c522fdd6ed3b18a7d5e93e7c172314dc

Что мешает открыть эти вкладки в разных браузерах и используя возможности Windows 10 через Settings - Sound - Advanced sound options определить конкретный Output для каждого браузера?

Примерно так

<div class="content-bottom">
    <div class="content-wrapper">
        <p>1111111111</p>
        <p>2222222222</p>
        <p>3333333333</p>
        <p>4444444444</p>
        <p>5555555555</p>
        <p>6666666666</p>
        <p>7777777777</p>
        <p>8888888888</p>
    </div>
</div>

.content-bottom {
    background: green;
    height: 227px;
    width: 500px;
    position: relative;
    overflow: hidden;
}
.content-bottom .content-wrapper {
    position: absolute;
    bottom: 0;
}

//свалил
window.blur();

//вернулся
window.focus();

document.addEventListener("visibilitychange", function(){
	if (document.hidden){
		console.log('Вкладка не активна');
	} else {
		console.log('Вкладка активна');    
	}
});

Всё из списка использовал в своих проектах.

• Webpack - модный, мощный, большое сообщество + много готовых плагинов/модулей/боилерплейтов
  
• Rollup - тоже модный, мощный, сообщество чуть меньше чем у брата выше, но плагинов/модулей тоже много
  
• Parcel - не очень модный, минимум конфигурации и быстрый старт, маленькое сообщество, тем самым меньше готовых модулей и т.д
  
• Vite - молодой, минимум конфигурации, быстрый старт, модный в буквальном смысле (native esm), + он очень быстрый, вот прям оооочень, скорость конечно поражает, если сравнивать с инструментами выше.
  

Всё из списка рекомендую, кроме parcel. В последнее время юзаю Vite, если понимаю что чего то не хватает, беру webpack

Легче всего добавить дату/время окончания действия логина и проверять её.
Удалять тоже можно, но только если нигде в сервисе не отмечаются/логируются действия пользователей.

Как динамически подключить свойства и методы другого class'а или trait'а?

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