Целесообразно ли хранение синтаксиса javascript в переменной?

В твоём примере - совершенно бессмысленно. Потому как document - это УЖЕ переменная: ты просто создаешь ещё одну ссылку на объект, только замедляя код на время создания переменной.

А вот var test = document.getElementById('name') столь же безусловно имеет смысл - но только если в коде будут НЕОДНОКРАТНЫЕ обращения к test. В этом случае ты экономишь время работы функции getElementById при втором и далее обращениях к test.

В V8 это не окажет значимого влияния на время выполнения (не надо слушать местных випанутых чайников, которые JS только нюхали, и то издалека).
Подобные ссылки создают для читаемости, а не для ускорения работы скрипта. И уж конечно, скрипт не начнет тормозить от объявления переменных :)
Целесообразно ли - да, конечно.

Только учитывайте, что в глобальной области видимости, такие переменные лучше либо не объявлять - либо, помещать объявление в самое начало основного модуля, и использовать префикс в имени переменных (например: $d), если уверены что не будет их переобъявления. Почему такая рекомендация? Дело в том, что объявление через var создает поле в текущем контекстном объекте (в глобальной области это window), и поэтому возможно непредсказуемое поведение скрипта.

Конечно. Я сам раньше старался использовать, как можно меньше переменных.
Но потом я пришёл к выводу, что это глупо.
Зачем многократно задействовать какой-то метод или функцию,
когда можно один раз задействовать этот метод и эту функцию?
Положить это дело в переменную, и многократно её использовать.
Ведь вызывая какую-то функцию, вы будете задействовать уже другие переменные.
Или API-вызовы. А это уже влияет на продуманность кода, и его быстродействие. Один раз положил, и пользуешься бессчётное количество раз.

document - это объект, зачем создавать дополнительную копию?

document уже является переменной. Целесообразно это делать для многократных действий над чем-либо, что вернёт какая-то функция. Над коллекцией, например:

ПЛОХО!
[...document.querySelectorAll('div')].forEach((node) => node.addEventListener('event1', () => {}));
[...document.querySelectorAll('div')].forEach((node) => node.addEventListener('event2', () => {}));

Хорошо!
var nodes = [...document.querySelectorAll('div')];
nodes.forEach((node) => node.addEventListener('event1', () => {}));
nodes.forEach((node) => node.addEventListener('event2', () => {}));