I have a XML which works with an XSLT file that transforms the XML into a table on an HTML page.
I need to be able to update this table based on what the user selects from a drop down. Two options:
- send new parameters to XSLT processor, re-transform, clear old HTML content, places new HTML content; do this every time drop down changes value
- use javascript function to navigate HTML code directly and unhide/hide table data cells.
What would be better performance-wise?
EDIT: basically trying to apply filters
The second option. There’s a difference between modifying HTML and modifying serialized DOM. If you clear the DOM and give the browser a new HTML string to replace it with, it will have to serialize that HTML into DOM. If you use JavaScript to modify parts of the DOM, then not only will you skip that step, but you’ll be taking advantage of optimisations in the rendering engine that restrict re-layouts to affected elements in the DOM, rather than the entire document.