Vlad_isLove

кстати интересно, что даже в эмбеде сохраняется значение локалстораджа

Есть ли способ полностью локально хранить переменные в браузере без участия сервера?

Есть - LocalStorage

Есть к нему псевдоклассы:

before и after - псевдоэлементы

.element:hover:before {
  opacity: 1;
}

Есть такая либа html2canvas. Она позволяет рендерить html в канвас, хоть и не совсем точно. Когда-то такую штуку делал с помощью неё.

Хранить в сессии SQL запрос вполне безопасно.

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

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

$result = array_reduce(
  $array, 
  function($carry, $item) {
    return ($item['shots'] > $carry['shots']) ? $item : $carry;
  },
  ['name' => '', 'shots' => -1]
);

$version = preg_replace('/^(\d)(\d*)(\d)$/', "$1.$2.$3", $version);

которые почему-то меняют свой адресс в зависимости от url. Не понимаю что у меня не так.

Всё у вас так.
Пути решения два
1. Указывать пути к статике от корня веб-сервера:

<link href="/design/css/main.css">
<img src="/design/images/logo.png">

2. Использовать тег <base>

<base href="http://my-super-site.ru/">
<link href="design/css/main.css">
<img src="design/images/logo.png">