Manufacturer prefix

from Wikipedia, the free encyclopedia

The manufacturer prefix (also browser prefix or vendor prefix ) is a short string of characters that browser manufacturers put in front of the actual identifier when they implement experimental functions. They were originally used in CSS , but have now also spread to other areas of web development .

Advantages and disadvantages

Vendor prefixes allow browser vendors to implement functions whose specification is still in development without causing compatibility problems with other browsers or the final standard. Proprietary extensions that cannot be found in any standard can also be implemented without fear of name collisions. Another advantage is that the prefix acts as a warning for programmers that the function is not yet available in all browsers and may still be subject to change.

One disadvantage is the code duplication , which is necessary if as many browsers as possible with different prefixes are to be supported. This can be partly mitigated with alternative stylesheet languages ​​like LESS . In addition, the code has to be updated again and again when another browser introduces a function with its own prefix or finally removes the prefix. If the programmer of a website forgets a browser, it will only display the page imperfectly, although from a technical point of view there is no reason for it. In many cases, experimental implementations of new features are provided without a prefix but disabled by default.

syntax

In CSS , the prefix starts with a hyphen ( -), followed by an abbreviation for the manufacturer and finally another hyphen separates the prefix from the actual identifier. Alternatively, the first hyphen can be replaced by an underscore ( _). In practice, the first hyphen is missing from some manufacturer prefixes.

In JavaScript , manufacturer prefixes are placed in front of the CamelCase syntax : The abbreviation for the manufacturer is usually given in lowercase letters, followed immediately by the actual identifier, the first letter of which is replaced by the associated uppercase letter.

Chance come Herstellerpräfixe in other places before and are adjusted with their respective syntax rules: In experimental attributes in HTML5 , there is no systematic, partly is the abbreviation without hyphens or other characters, some with a hyphen as a separator, some still with a leading x-real the Attribute names prefixed. Uppercase letters and an underscore are used in WebGL .

Known prefixes

The following list gives some common manufacturer prefixes in the CSS syntax.

prefix use
-epub- within books in EPUB format
-moz- Gecko ( Mozilla Firefox )
-ms- Trident ( Internet Explorer ), Microsoft Edge
-o- Presto ( Opera up to version 12)
-webkit- WebKit ( Safari ), Blink ( Google Chrome , Opera from version 15)

Due to the dominance of WebKit-based browsers, especially in the mobile sector, many websites only use the webkitprefix and neglect other browsers. This led manufacturers of other browsers to consider webkitinterpreting the prefix in addition to their own prefixes . Microsoft Edge interprets some Webkit properties, as does Firefox 49 or later. Which properties should be supported is specified in a WHATWG standard.

Individual evidence

  1. Eric Meyer: Prefix or Posthack. In: A List Apart . July 6, 2010, accessed September 2, 2016 .
  2. ^ Peter-Paul Koch: CSS vendor prefixes considered harmful. In: QuirksBlog. March 22, 2010, accessed September 2, 2016 .
  3. Blink - The Chromium Projects. Vendor prefixes. Retrieved September 9, 2016 .
  4. Syntax and basic data types. Vendor-specific extensions. In: Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification. World Wide Web Consortium , June 7, 2011, accessed September 2, 2016 .
  5. <iframe> - HTML. In: Mozilla Developer Network . Accessed September 2, 2016 .
  6. <canvas> - HTML. In: Mozilla Developer Network . Retrieved September 6, 2016 .
  7. <input> - HTML. In: Mozilla Developer Network . Retrieved November 8, 2016 .
  8. Using WebGL extensions. In: Mozilla Developer Network . Retrieved November 8, 2016 .
  9. ^ CSS Property Reference. In: EPUB 3 Accessibility Guidelines. Retrieved September 2, 2016 .
  10. ^ Tantek Çelik, Eric Meyer: The Vendor Prefix Predicament: ALA's Eric Meyer Interviews Tantek Çelik. In: A List Apart . February 14, 2012, accessed September 2, 2016 .
  11. Microsoft Edge Team: A break from the past, part 2: Saying goodbye to ActiveX, VBScript, attachEvent ... In: Microsoft Edge Dev Blog. May 6, 2015, accessed September 2, 2016 .
  12. Firefox 49 for developers. Compatibility. In: Mozilla Developer Network . Accessed September 2, 2016 .
  13. Compatibility Standard. Retrieved September 21, 2016 .

Web links