Enviando Ajax para o site e retornando um JSON, assim manipulando o array para usar no aplicativo.
Nesse caso, o código JavaScript necessário vai ser muito maior, já que contém a lógica para exibir os dados.
Isso significa que você vai ter que carregar mais JavaScript antes de exibir os dados.
Mas isso pode se pagar ao longo do tempo se os dados forem carregados várias vezes sem recarregar a página, já que a quantidade de dados transmitidas é menor por requisição.
Essa abordagem tende a apresentar melhor performance, mas também maior complexidade e logo sua base de código pode se tornar um caos a não ser que você e os demais integrantes da equipe sejam desenvolvedores disciplinados e escrevam JavaScript modular (AMD, ES 6).
Enviando Ajax para o site e nele montando uma string com código HTML e retornando-a para o aplicativo usar esse HTML na sua interface.
O JavaScript tende a ser muito mais simples e conciso, porém a quantidade de dados transmitidos por requisição é muito maior.
Trocando em miúdos, o site carrega mais rápido, mas a cada nova atualização assíncrona ele vai consumir um pouco mais de banda e processamento no servidor.
Outro problema dessa abordagem é que pode ser complexo manter trechos da página separados da página principal que ora são renderizados dentro do contexto da página, ora de forma independente. Sem uma boa organização e um bom motor de renderização isso tende a gerar código espaguete ou duplicado.
Normalmente polui o código do backend com infinitas tags HTML sendo concatenadas
Não necessariamente. Em PHP você pode ter trechos de templates que podem ser renderizados de forma independente ou em conjunto com a página. Alguns frameworks permitem você criar componentes ou widgets que funcionam dessa forma.
Você impede que aquela url ajax seja utilizada em outras partes do seu projeto, pois nem todo mundo que precisa daqueles dados, precisa daquele HTML.
Renderizar HTML definitivamente acopla o serviço com a sua página, mas nada impede de você manter serviços públicos em JSON e privados em HTML separadamente.
Pela minha experiência, os consumidores de dados de sistemas terceiros geralmente tem uma visão diferente dos dados. Não é sempre o caso, mas tentar manter uma única API para uso interno e externo pode ser uma dor de cabeça muito maior, já que você fica engessado pelo contrato da API que não pode quebrar para os sistemas externos.
Enfim, escolheria retornar somente os dados para o seu frontend e tratar todo o HTML que você precisar por lá mesmo.
De um ponto de vista arquitetural esta é forma mais sofisticada, a tendência atual e preferência da grande maioria dos desenvolvedores front end, por possibilitar:
- Melhor separação de conceitos: não divide a lógica de renderização entre cliente e servidor, mas concentra no cliente
- Flexibilidade: permite a evolução do front end independente das APIs ou serviços do back end.
Finalmente, se você estiver mesmo preocupado com desempenho, considere usar um protocolo mais compacto que JSON, tal como o Protobuf do Google. Veja algumas vantagens aqui e uma implementação em PHP aqui.