Qual é a diferença entre o modo de produção e desenvolvimento em Angular2?

Por algum motivo, tenho que executar meu aplicativo no modo de produção. Qual é a diferença entre esses modos?

No modo de desenvolvimento, a detecção de alterações executa uma segunda execução imediatamente após a primeira execução e produz um erro se qualquer valor vinculado tiver sido alterado entre a primeira e a segunda execução. Isso ajuda a localizar erros nos quais a verificação de valores tem efeitos colaterais ou campos ou funções não retornam o mesmo valor em chamadas subseqüentes que prejudicam a detecção de alterações do Angular.

No modo de desenvolvimento, durante a segunda execução de detecção de alterações, o Angular também faz algumas comparações de object profundo que não serão feitas na produção para detectar alterações de modelo que não são permitidas.

Atualizar:

No modo de desenvolvimento, uma dica também é impressa no console quando o serviço de desinfetante de HTML retira valores das vinculações [innerHTML]="..." ou [ngStyle]="..." . Veja também: No RC.1 alguns estilos não podem ser adicionados usando a syntax de binding

Os documentos para o estado de ApplicationRef.tick () :

No modo de desenvolvimento, tick() também executa um segundo ciclo de detecção de alterações (TTL = 2) para garantir que nenhuma alteração adicional seja detectada. Se alterações adicionais forem detectadas durante esse segundo ciclo, as vinculações no aplicativo terão efeitos colaterais que não podem ser resolvidos em uma única passagem de detecção de alteração. Nesse caso, o Angular lança um erro, pois um aplicativo Angular só pode ter uma passagem de detecção de alteração durante a qual toda a detecção de alteração deve ser concluída.

A razão pela qual não podemos ter alterações adicionais é porque no modo de produção, a detecção de alterações só é executada uma vez, o que significa que cada componente na tree de componentes é examinado uma vez (TTL = 1) … de cima, em profundidade ordem. Portanto, se, por exemplo, uma alteração na propriedade de input de um componente filho causar uma alteração em alguma outra propriedade que o componente pai tenha vinculado em um view / template, a exibição do componente pai não será atualizada (porque a detecção de alterações não revisitará o componente pai no modo de produção … por causa da travessia da tree “uma passagem”. Ele só será atualizado na próxima vez que algum evento acontecer e a detecção de alterações for executada novamente – mas é tarde demais!

Aqui está um Plunker que viola a regra – um componente filho possui um método set em uma propriedade de input que modifica outra propriedade de input. Sim, é um exemplo artificial, mas é mais fácil de entender do que o seguinte:

Outro cenário em que você pode encontrar esse problema é com pipes com estado. Confira esta resposta se esse é o seu problema.

Você deve descrever seu problema (em outra pergunta SO). Deveria haver uma maneira de consertar isso.