document.write() Intervention!

The use of document.write() has always been a bad “code smell” in JavaScript. Most web performance guides such as WebPageTest and Yahoo Exception Performance have warned against this practice.

In most cases, document.write() can be replaced by inserting innerHTML into an empty element after the rest of the page loads. This approach also allows the developer to “think” about how the page might react in cases where JavaScript is disabled or not available on the client.

Google has recently changed the default behavior, such that when on a slow (currently 2G) connection, but discussions have also leaned toward including any slow connection.
As such, right now, the following will occur on slow (2G) connections:

  • Chrome 53+ (warning displayed in debugger console)
  • Chrome 55+ (blocked – code will not execute, warning message will appear in debugger console)

For users on slow connections, such as 2G, external scripts dynamically injected via document.write() can delay the display of main page content for tens of seconds, or cause pages to either fail to load or take so long that the user just gives up. Based on instrumentation in Chrome, we’ve learned that pages featuring third-party scripts inserted via document.write() are typically twice as slow to load than other pages on 2G.

My advice – remove all use of document.write() for required content in your code now, as your users MAY NOT see that content if you do not.


HTC/.htc files

What is it? Internet Explorer 5-9 introduced behaviors. Behaviors are a way to add behaviors to XML (or HTML) elements with the use of CSS styles.

Why avoid it? The behavior attribute is only supported by Internet Explorer.

What to use instead? Use JavaScript and XML DOM (or HTML DOM) instead

MSIE 5-9 support a scripting (VBScript/JScript) technology called HTML Components (HTCs) to aid in DHTML behaviors. Support was dropped in MSIE 10, you will have to force the browser into MSIE 9 compatibility to use these.

Mozilla? it has a similar proprietary implementation.

Included CSS style:

<style type="text/css">
h1 { behavior: url( }

Inline CSS style:

<p style="behavior:url(">Hello World</p>

Apache MIME Type:

AddType text/x-component .htc


Fix for Flash files ignoring z-index

Flash objects often interfere with your layering within your DHTML applications and appear above them in the DOM stacking order, standard CSS and HTML solutions do not have any impact. Fortunately there is a simple solution to this ‘problem’ thats been supported in all common browsers since MSIE4.

On <object>
<param name="wmode" value="transparent" />

In <embed ... wmode="transparent" >