Results 1 to 2 of 2

Thread: Summary of <!DOCTYPE> Recommendations

  1. #1
    Sencha User charris's Avatar
    Join Date
    Sep 2010
    Brooklyn, NY
    Vote Rating

    Default Summary of <!DOCTYPE> Recommendations

    There are a ton of threads going back a few years on the use (or avoidance of using) the <!doctype> declaration. In the process of digging through all those threads I ended up with some notes that summarize everything. I thought I'd share them here in case it's helpful to someone in the future. Maybe something like this could be added to the Wiki "FAQ" page?

    ExtJS 3.x and Earlier: Sencha recommends NOT using a doctype

    • Sencha devs Aaron Conran and Animal recommended NOT using a doctype prior to ExtJS 4 (i.e., that was their recommendation back in 2009). Examples:
      • "Our recommendation is to NOT use a doctype as it will induce the least amount of browser bugs particularly in IE. When you force a browser to operate in a more strict mode (which a doctype does) you may uncover strange issues. We try to work around as many of these problems as possible, but the best bet is to not use a doctype." - aconran, March 2009 (source)
      • "[...] the best doctype to use is no doctype at all." - aconran, July 2009 (source)
      • "Mostly I've seen recommendations to use no doctype. We don't use a doctype." - Animal, July 2009 (source)

    • Excluding the doctype declaration causes IE to default to "quirks" mode, which is slightly faster than strict/standards mode. One reason for this is that ExtJS 3 does not have to re-calculate and adjust element widths/heights via JavaScript for IE in quirks mode. It does, however, when IE is running in strict mode (i.e., when the <!DOCTYPE> is included).

    ExtJS 4+: Sencha recommends using "strict" doctype.

    • Sencha devs Tommy Maintz and Jamie Avins recommend using strict doctype with ExtJS 4+ (source)
    • Strict doctype causes browser to run in standards mode. Most browsers are optimized to run in this mode (IE being an exception).
    • Examples of strict doctype declaration:
      • HTML 4: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "">
      • HTML 5: <!DOCTYPE HTML>
      • Note: IE8 supports the HTML5 version of strict doctype declaration. (source)
      • For more info on HTML doctype tags see this and this.

    • In summary, use <!DOCTYPE HTML> with ExtJS 4+ unless you need to support browsers older than IE8 (in which case, use the HTML 4-style doctype declaration)

  2. #2
    Sencha User
    Join Date
    Dec 2008
    Manchester, UK
    Vote Rating

    Default Image blurring in IE8

    I've noticed that if I use a doctype then I get blurring of the button text; with no doctype present then the button text looks a lot cleaner - see the attached images.

    I notice that in IE, with no doctype specified, that the buttons are formed from tables and image parts. Do you know if it is possible to manually specify to use this type of button markup? (so that it could always be turned on when using IE)

    I would not use a doctype, but I then run into problems when centering components using CSS "margin: auto" and have also noticed problems with tree rendering without a doctype. Therefore I think I need to keep it.

    Thanks for any help,

    no_doctype_button.png doctype_button.png

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts