переключение между 2 режимами отображения

[Seran4ek]

Всем привет, имеется страничка, на которой контент может отображаться в 2 вида - по центру( с max-width) и по всей ширине, выполнено это сейчас довольно топорно - имеется функция setStyle, меняет стиль по клику на кнопочку:

var setStyle = function(style) {
		    	if(style == 'default') {
		    		storage.style.сохранить('default')
		    	    обертка_контента.classList.remove('centered');
		    	} else {
		    		storage.style.сохранить('centered');
		    		обертка_контента.classList.add('centered');
		    	}
		    }

она упрощена, но суть понятна. Далее при загрузке страницы сразу после html кода обертки добавляется <script> </script> с содержимым вроде

if(storage.read('style') == 'centered') {
	обертка_контента.classList.add('centered');
}

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

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

[void()]

window.addEventListener("DOMContentLoaded", function() {
обертка_контента.classList.add(storage.read('style'));

function setStyle() {
  обертка_контента.classList.toggle('centered');
  storage.style.сохранить(обертка_контента.classList);
}
});

[Seran4ek]

DOMContentLoaded не подходит, так как при добавлении класса на этом этапе наблюдается "мигание" при переключении стилей, класс нужно добавить как можно раньше, потому это и делается сразу после html кода обертки инлайн скриптом, а вот насчет toggle открыли мне глаза, спасибо, забыл совсем про этот чудный метод