String.replace interpreta $ mesmo quando o padrão é uma string

Eu estava injetando HTML pré-renderizado em um template:

template.replace("<!--app-html-->", html);

Funciona na maioria dos casos, e falha de um jeito difícil de rastrear quando o HTML contém certos caracteres.

O detalhe: mesmo quando o padrão é uma string comum, a substituição passa pelo processamento de padrões. Sequências como $&, $1, $` e $' têm significado especial:

"alvo".replace("alvo", "a$&b");
// "aalvob"  -- e nao "a$&b"

Em HTML real isso aparece em lugar nenhum óbvio, até alguém escrever um artigo sobre expressões regulares e $& ir junto no texto. Aí um pedaço do documento simplesmente se duplica ou desaparece.

A correção é usar uma função como substituição, porque o retorno dela é inserido literalmente:

template.replace("<!--app-html-->", () => html);

Vale para qualquer conteúdo que você não controla: HTML renderizado, texto de usuário, JSON serializado. Se o valor vem de fora, use função.