Преимущества и недостатки цепочек в JavaScript

Не смотря на то, что цепочки сокращают код, в большинстве случаев введение переменной все-таки удобнее. Сравните два примера - сейчас я ввел переменную elem и могу записывать любое количество атрибутов, при этом querySelector вызывается только один раз:

let elem = document.querySelector('#elem');
elem.value = 'www';
elem.type  = 'submit';

А сейчас я не ввожу новую переменную и поэтому мне приходится вызывать querySelector два раза:

document.querySelector('#elem').value = 'www';
document.querySelector('#elem').type  = 'submit';

На мой взгляд, этот код стал сложнее, хотя и занимает на одну строчку меньше. Кроме того, если я захочу сменить значение id с 'elem' на какое-то другое, мне придется делать это во многих местах, что не очень удобно.

Есть и еще проблема - нагрузка на браузер. Поиск элементов по странице, который делает метод querySelector, является довольно медленной операцией (и вообще любая работа с элементами страницы - это медленная операция - запомните это).

В нашем случае, если мы каждый раз используем querySelector, то браузер каждый раз будет обрабатывать HTML страницу и искать элемент с заданным id несколько раз (не важно, что id одинаковые - браузер проделает все действия несколько раз), совершая бесполезные операции, которые могут замедлить работу браузера.

Если же мы используем переменную elem - никакого поиска по странице не происходит (элемент уже найден и ссылка на него лежит в переменной).

Дан следующий код:

<img id="image" src="avatar.png" width="300" height="500">

console.log(document.querySelector('#image').src);
console.log(document.querySelector('#image').width);
console.log(document.querySelector('#image').height);

Укажите на недостатки данного кода. Исправьте их.