Лучше прямо в HTML встраивать, чтобы не плодить лишних запросов к внешнему SVG файлу. Однако, если вставлять inline способом, то кешироваться не будет.
На одной конференции Яндекса советовали вставлять через JS, чтобы они кешировались.
Сейчас опишу, как я делаю.
1) Создаем JS файл с inline SVG. К примеру, такой

// Тут хранятся иконки в SVG
var icon = '
<svg style="display:none;">\
  <defs>\
    <symbol id="header-phone" viewBox="0 0 850.394 850.394">...</symbol>\
  </defs>\
</svg>';    
// Вставляем иконки в HTML        
document.getElementById('svg-icon-placeholder').innerHTML = icon;

2) Создаем в HTML пустой div с id svg-icon-placeholder. В него мы и будем вставлять SVG
3) Юзаем через use :)
Довольно просто, но я пока не придумал как автоматизировать сборку спрайтов через GULP таким способом. Если знаете, то подскажите как)