• Revista PROGRAMAR: Já está disponível a edição #53 da revista programar. Faz já o download aqui!

Nazgulled

Formatar output HTML gerado via PHP

25 mensagens neste tópico

Já tentei várias vezes fazer pesquisa sobre o assunto mas nunca encontrei nada que me ajudasse neste campo...

Não sei quantos de vós usam sistemas de templates onde usando PHP processam tudo que há a processar e assim que toda a página estiver pronta, fazem output da mesma com um simples echo. Mas como já deve ter dado para perceber, eu faço isso... Mas agora, estou à procura de alguma forma que me dê para formatar código HTML antes de fazer o output. Ou seja, com o código muito bem indentado e tal.

Há alguma forma de fazer isto usando PHP ou até mesmo alguma biblioteca que o faça?

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Usas uma estrutura XML. Em vez de ires concatenando strings, vais adicionando elementos a um DOM e depois é só gerar o XML com os espaços todos bonitinhos.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

P.S: djthyrax concatenando :P

Thx, nunca acerto na palavra. :P
0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

@djthyrax

Parece-me uma solução rebuscada de mais e muito trabalhosa, não sei se compensa esse método. Procura algo mais simples. Aliás, até preferia perder tempo a programar eu algo que formatasse o código de forma simples... Mas antes disso, pode ser que já alguém o tenha feito.

@MAiDEN_DuDE

Assim visto na diagonal e após ler a descrição, parece-me ser isso, mais tarde irei testar... Obrigado!

Aceitam-se sempre mais sugestões!

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

acho que devias fazer o contrário. Em vez de perder tempo a por tudo bonito e espaçado, devias enviar o output para o cliente o mais compactado possível. Menos KB para o cliente fazer download.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

E eu irei fazer isso com JavaScript porque sempre vi em todo o lado que fazia diferença mas em HTML nunca vi em lado nenhum que isso era importante.

Não sei se a razão será que HTML normalmente o código não é muito, enquanto que JavaScript se pode tornar grande, embora HTML também se possa tornar um bocado grande, como por exemplo, num fórum.

Mas digam-me lá, que razão acham (ou sabem) porquê que se fala tanto em compressão JavaScript e não em HTML?

Acabei de encontrar um tópico interessante e vou aqui deixar links para os posts em questão:

http://www.thescripts.com/forum/post2456703-7.html

http://www.thescripts.com/forum/post2458072-10.html

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Relativamente ao Tidy, alguém com PHP5 num servidor remoto (não caseiro) que me possa dizer se por acaso o seu server vem com a extensão do Tidy activa? Só para ter uma ideia se costuma estar activa por omissão como a GD ou nem por isso. É que no meu não está...

É que se só funciona com a extensão activa, não é uma solução lá muito boa...

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Mas javascript eu acho que nem se devia preocupar muito. O ficheiro é carregado uma vez e fica na cache do browser, sem ter de fazer nada.. é assim.

Agora faz-se o download do html sempre que se reload a página e aí já interessa. Já vi sites com poupanças de +60% de tráfego, só por eliminarem os espaços brancos no html.

Minha opinião : )

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Pois, mas eu não consigo ter a mesma :D

Tipo, o html normalmente são uns míseros kbs, com "compressão" a página que estou a testar tem 3Kb normal, com compressão gzip fica 810b, logo, não vejo necessidade de remover espaços brancos. Já no Javascript as coisas são diferentes. Normal ocupa 150Kb, com compressão gzip 43Kb e com compressão gzip mais código compacto, apenas 21Kb. Acho que aqui a diferença é significativa, no HTML, nem por isso.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Pois, mas eu não consigo ter a mesma :D

Tipo, o html normalmente são uns míseros kbs, com "compressão" a página que estou a testar tem 3Kb normal, com compressão gzip fica 810b, logo, não vejo necessidade de remover espaços brancos. Já no Javascript as coisas são diferentes. Normal ocupa 150Kb, com compressão gzip 43Kb e com compressão gzip mais código compacto, apenas 21Kb. Acho que aqui a diferença é significativa, no HTML, nem por isso.

Para javascript tens o packer: http://dean.edwards.name/packer/ . Funciona particularmente bem com grandes códigos. Mas sinceramente acho que o tamanho do código cada vez mais se torna irrelevante.

Quanto à formatação, eu faço deste método:

$cont .= '
<div>
    <p></p>
</div>';

Não sei se dá para perceber, mas isso vai criar uma linha nova e formatá-la.

Depois depende do sítio onde vais fazer echo da variável de conteúdo.

Agora quando é para listar coisas em tabelas, etc... nem me preocupo em formatar o código.

Outra coisa a notar é o seguinte:

Quando fazes include de um ficheiro ou echo no meio do html, convém sempre deixar 1 linha de intervalo, para o php não atropelar o html seguinte. Ex:


<?php include 'bla.php'; ?>

<p>bla</p>

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Eu quando mencionei "código compacto" estava precisamente a falar do Packer. E não concordo que o tamanho do código seja irrelevante. Quando começa a ser muito código, começam a ser muitos kbs. E não me refiro a isto em termos de largura de banda, mas sim em rapidez, tudo bem que cada vez temos ligações mais rápidas mas há sempre uns pequenos delays que podem ser reduzidos. Se estas técincas de compressão não fossem necessárias, ninguém as usava, mas não é isso que acontece.

Quanto ao exemplo de formatação que deste, sinceramente não percebi nada... Não sei o que é que um <div> e um <p> dentro de uma variável vai ajudar à formatação... Até porque eu não estava a perguntar como o fazer manualmente pois nesse campo safo-me bem.

Quanto ao resto do teu post... Tipo, eu disse no meu post inicial que usava um sistema de templates e se há coisa que eu não faço em PHP e acho que ninguém o devia fazer (mas não vou discutir isso aqui) é juntar código PHP com HTML. Ou seja, o resto do teu post é irrelevante para mim.

Agradeço a contribuição de todos mas acho que vou "optar pelo post" do MAiDEN_DuDE, apesar de ainda não ter testado a função...

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Siceramente não estou a ver uma forma de identar o html sem o parsar para uma estrutura de dados em árvore, que é o que os nossos browsers fazem para mostrar uma página.

A forma de fazer isso é parsar isso com o DOM. Ficas com uma estrutura em árvore e depois é só incrementar espaços, ou tabs, conforme te afastas da raíz do documento.

Foi mais ou menos o que o djthyrax sugeriu, só que guardar a estrutura de dados num xml não é necessário.

Mas atenção que isto tem custos elevados em termos de consumo de recursos.

Mas agora confundiste-me.

Se usas um sistema de templates não precisas de uma ferramenta dessas. Poder arrumar o html é uma das vatagens do uso de templates.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Mas a função que está aqui, supostamente faz isso sem usar estruturas de árvores e não sei quê... Apenas usa expressões regulares para indentar o código, mas como já disse anteriormente, ainda não testei. Mas diz isso no site:

// This is a function for PHP scripts to clean up HTML code before outputting it.

// The function applies correct indentation to HTML/XHTML 1.0 and JavaScript

// And makes the output much more readable.

// You can specify the wanted indentation through the variable $indent

Quanto ao sistema de templates é aquele que eu lancei o artigo para a revista e é muito básico mesmo. E a ideia é que eu tenho o conteúdo HTML separado por ficheiros, ou seja:

Ficheiro 1:

<tag>
<tag>
	<tag>
	{REFERENCIA}
	</tag>
</tag>
</tag>

Ficheiro 2:

<tag>
TEXTO
</tag>

A ideia é substituir {REFERENCIA} pelo pedaço de código no ficheiro 2 e vai ficar assim quando o fizer:

<tag>
<tag>
	<tag>
	<tag>
TEXTO
</tag>
	</tag>
</tag>
</tag>

Mas eu quero que fique antes assim:

<tag>
<tag>
	<tag>
		<tag>
			TEXTO
		</tag>
	</tag>
</tag>
</tag>

(ou algo correctamente indentado)

E para isso preciso de ter algo que processe o HTML todo e que aplique indentação correcta. Eu não consigo fazer isto no meu sistema de templates sem perder muito tempo a fazer uma coisa em condições e simples. Eu gosto do sistema que uso pela sua simplicidade e facilidade de utilização e não o quero complicar. E assim à primeira vista, a função de lá de cima parece fazer exactamente o que eu quero, tenho ainda de testar. Se funcionar vou adaptar ao script e não ao sistema de templates porque eu só quero indentar o código quando a página estiver completamente construida e não a pedaços de código.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Siceramente não estou a ver uma forma de identar o html sem o parsar para uma estrutura de dados em árvore, que é o que os nossos browsers fazem para mostrar uma página.

A forma de fazer isso é parsar isso com o DOM. Ficas com uma estrutura em árvore e depois é só incrementar espaços, ou tabs, conforme te afastas da raíz do documento.

Para HTML é capaz de ser melhor construir a árvore (porque nem todas as tags são fechadas), para XHTML, não me parece que seja necessário. É só ir percorrendo o texto e contando as tags que faltam fechar.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Ah ok, estou a ver. Mas isso não serão preciosismos a mais?

Bem, isso é ao gosto de cada um.

Anyway, a função que o maiden dudo afixou põe o html numa estrutura em árvore, só não a guarda.

Rui, idem, isso é o mesmo que construir uma estrutura em árvore.

EDIT: ok, eu explico. Eu só falei na árvore porque o DOM é uma forma de fazer isso que está mais desenvolvida do que duas ou três expressões regulares orquestradas por uma pessoa com o objectivo de desenrascar.

As expressões regulares são bastante poderosas mas a maior parte das pessoas não tem noção dos recursos que elas consomem quando não se tem cuidado.

Um documento HTML (tal como um XHTML) é uma árvore, por isso para identá-lo teremos sempre que usar essa estrutura de dados, mesmo que de forma pouco explicita.

O que pode parecer mais simples acaba por ser mais complicado, a função apresentada é mais complicada do que recorrer ao DOM, pode ser mais facil de usar até porque os métodos do DOM não estão muito bem documentados no php.net.

Para as minhas experiencias eu usaria esta função porque funciona out-of-the-box. Mas para um projecto sério, é capaz de ser arriscado confiar o parsing de html a uma função escrita sem ter em vista a implementação rigorosa de nenhum standard. Podes acabar por corromper o teu HTML e possivelmente criar graves crateras de segurança, integridade de dados, e por aí fora.

Se utilizares o DOM, tambem não tens garantias a 100%, mas sempre usas o mesmo método que os browsers utilizam. É à partida uma solução mais robusta.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Eu quando mencionei "código compacto" estava precisamente a falar do Packer. E não concordo que o tamanho do código seja irrelevante. Quando começa a ser muito código, começam a ser muitos kbs. E não me refiro a isto em termos de largura de banda, mas sim em rapidez, tudo bem que cada vez temos ligações mais rápidas mas há sempre uns pequenos delays que podem ser reduzidos. Se estas técincas de compressão não fossem necessárias, ninguém as usava, mas não é isso que acontece.

Pois indo por aí, até a própria identação gasta bytes :P.

Quanto ao exemplo de formatação que deste, sinceramente não percebi nada... Não sei o que é que um <div> e um <p> dentro de uma variável vai ajudar à formatação... Até porque eu não estava a perguntar como o fazer manualmente pois nesse campo safo-me bem.

Quanto ao resto do teu post... Tipo, eu disse no meu post inicial que usava um sistema de templates e se há coisa que eu não faço em PHP e acho que ninguém o devia fazer (mas não vou discutir isso aqui) é juntar código PHP com HTML. Ou seja, o resto do teu post é irrelevante para mim.

Ajuda no sentido de poderes fazer tu mesmo a formatação, mas tou a ver que não queres ir por aí e queres uma coisa automática. Só agora reparei na função maiden. Só não sei o quanto isso depois vai prejudicar a perfomance.

Isso de juntar html com php... epá depende, enquanto tu utilizas um template em que substituis palavras chave, eu faço include a um ficheiro php e lá no meio do html tenho, por exemplo, <?= $conteudo['header'] ?>

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Rui, idem, isso é o mesmo que construir uma estrutura em árvore.

Não é exactamente a mesma coisa... Não tens que a construir nem armazenar.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Isso de juntar html com php... epá depende, enquanto tu utilizas um template em que substituis palavras chave, eu faço include a um ficheiro php e lá no meio do html tenho, por exemplo, <?= $conteudo['header'] ?>

Mas é precisamente isso que eu detesto fazer. Misturar dessa forma HTML com PHP para mim não faz sentido, há que saber separar as coisas. HTML é uma coisa, PHP é outra completamente diferente e não deveriam ser misturadas complicando a legibilidade do código. É só o que eu acho, cada um faz como bem entender.

Para as minhas experiencias eu usaria esta função porque funciona out-of-the-box. Mas para um projecto sério, é capaz de ser arriscado confiar o parsing de html a uma função escrita sem ter em vista a implementação rigorosa de nenhum standard. Podes acabar por corromper o teu HTML e possivelmente criar graves crateras de segurança, integridade de dados, e por aí fora.

Se utilizares o DOM, tambem não tens garantias a 100%, mas sempre usas o mesmo método que os browsers utilizam. É à partida uma solução mais robusta.

Se acabar por corromper o HTML eu vou reparar nisso porque testo extensivamente tudo que faço e tudo que modifico, para além de ter no cantinho inferior direito, algo que me avisa se o HTML está bem ou mal. De qualquer forma não me parece que isso aconteça e acho que tas a exagerar nisso da segurança, integridade de dados e etc... Aquilo não é nada mais nada menos que ver quando certas tags são abertas e tal adicionar a indentação necessária, não vai modificar dados nenhuns. E nem consigo pensar como raio é que vai comprometer a segurança ao adicionar ou remover uns \t's aqui e ali...

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Se o html for todo escrito por ti não há à partida grande perigo pois o html é supostamente válido. Mas se usares isso em html gerado por exemplo por um parser de bbcode o utilizador pode tentar gerar html inválido utilizando bbcode e enviar essa função por exemplo para um cico infinito, ou terminar antes de ser suposto.

Injecções de código html ou php tambem não me parecem ser possíveis recorrendo a essa função.

Mas ok, isto já é ser paranóico à bruta, que é uma coisa que pessoalmente tambem me irrita :S

O formato dos templates é um pouco ao gosto de cada um. Eu prefiro tags tipo

{title} ou mesmo <title>

porque acho que é mais legivel, mas o método do battousai é mais aconselhado quando a velocidade interessa. E tambem é mais simples de implementar.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Se o html for todo escrito por ti não há à partida grande perigo pois o html é supostamente válido. Mas se usares isso em html gerado por exemplo por um parser de bbcode o utilizador pode tentar gerar html inválido utilizando bbcode e enviar essa função por exemplo para um cico infinito, ou terminar antes de ser suposto.

Injecções de código html ou php tambem não me parecem ser possíveis recorrendo a essa função.

Mas ok, isto já é ser paranóico à bruta, que é uma coisa que pessoalmente tambem me irrita :S

Quase tudo nos meus programas é feito por mim, originalmente pode não ter sido mas tento perceber e fazer por mim para que as coisas fiquem feitas como deve ser. Por exemplo, se eu tiver algum parser de bbcode será feito por mim também. Ou seja, no fundo, não tenho de me preocupar com HTML alheio porque isso nunca vai existir.

O formato dos templates é um pouco ao gosto de cada um. Eu prefiro tags tipo

{title} ou mesmo <title>

porque acho que é mais legivel, mas o método do battousai é mais aconselhado quando a velocidade interessa. E tambem é mais simples de implementar.

Algo me diz que nunca viste o artigo de templates que escrevi na revista 9 porque eu uso exactamente tags tipo {title}. E sinceramente, não percebi o que é que isso está relacionado com o método do battousai é que misturar PHP + HTML não tem nada a ver com um sistema de templates.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

:cheesygrin: lol

por acaso li e até comentei no tópico em questão e tu até respondeste.

anyway, a diferença é que no método do batusai não é preciso parsar o template para proceder às substituições. É mais rápido.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

:confused: lol

por acaso li e até comentei no tópico em questão e tu até respondeste.

anyway, a diferença é que no método do batusai não é preciso parsar o template para proceder às substituições. É mais rápido.

Mais rápido, mas mais confuso se for uma página de grandes dimensões :cheesygrin:, por isso eu também adaptei para mim um sistema de templates (baseado no do Nazgulled)

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Pois, mas para mim isso não é um "método" é misturar coisas que não devem ser misturadas e eu gosto de ter cada coisa no seu devido lugar e tudo bem estruturado. E sinceramente, não me parece que a diferença entre ter código PHP + HTML misturado faça diferenças significativas para não usar um sistema de templates simples como o que eu uso. Nunca tive problemas com ele e nunca o achei lento, achei normal.

E de qualquer forma, esta conversa está ser afastada do tema em questão...

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!


Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.


Entrar Agora