И тот, кто занимался тем же самым - имел те же вопросы что и у меня.Ну как-бы да, имел похожие вопросы. Оторвал жопу от стула, побщался с теми кто ставил задачу, узнал чего именно они хотят, какие метрики для них важны, а какие не очень. потом под эти требования искал решение.
{{ какбы намекают, что используется какой-то шаблонизатор. Возможно mustache или что-то с похожим синтаксисом.var obj = {
name: 'Vasya',
x: '300px',
y: '200px'
},
str = `<div style="top: ${obj.y}; left: ${obj.x}">${obj.name}</div>`
document.body.insertAdjacentHTML('beforeend', str)