If the type attribute is not declared, it defaults to text/css.

如果類型屬性未聲明,則默認為文本/css。

Is there a performance cost (however small) for not declaring type="text/css" in the <style> element?

如果在

12 个解决方案

#1


19  

From MDN Style docs on the type attribute:

來自MDN風格文檔的type屬性:

This attribute is optional and defaults to text/css if it's missing.

此屬性是可選的,如果缺少文本/css,則默認為文本/css。

Since it defaults to the correct one, there is no impact.

因為它默認為正確的,所以沒有影響。

#2


9  

You might as well ask if there is a performance cost for making an HTTP request in the first place. It is impossible to completely eliminate the notion of performance itself. At some point you're either at 100% performance efficiency for your page, standards compliant or not. The complimentary aspect to performance is standards in this case. Another example would be entrepreneurialism and execution. All the great ideas in the world are utterly useless unless you can execute to make said business fit into an economic model that works in the real world.

您不妨首先問一問,發出HTTP請求是否存在性能成本。不可能完全消除性能本身的概念。在某些情況下,您的頁面或者達到100%的性能效率,或者符合標准,或者不符合標准。在這種情況下,對性能的稱贊是標准。另一個例子是創業精神和執行力。世界上所有偉大的想法都是毫無用處的,除非你能執行,使其成為現實世界中行之有效的經濟模式。

Now it is possible to make great leaps in performance. Back in the 80s and 90s, you could either buy a cheap Honda (non-standards here) or you could improve performance (Porsche, Ferrari or McLaren). Then Tesla came along and completely blew away even the best in acceleration. Disclaimer: I really don't care about cars but it's an easy analogy for most to comprehend.

現在有可能在性能上取得巨大飛躍。回到80和90年代,你可以買一輛便宜的本田(這里沒有標准),也可以改進性能(保時捷、法拉利或邁凱輪)。然后,特斯拉出現了,甚至連最好的加速技術也完全被吹走了。免責聲明:我真的不關心汽車,但這是一個很容易理解的類比。

As someone who has left very few rocks untouched, I can attest to you personally that eventually, it is not you though your environment in which performance increases should be sought. So while I commend you for trying to think outside the box I would make other considerations as to where to improve performance.

作為一個幾乎沒有碰過石頭的人,我可以親自向您證明,最終,盡管應該尋求性能提高的環境不是您。因此,當我贊揚您嘗試跳出固有思維模式時,我還會考慮如何改進性能。

  • Be wary of too much utilization of the * selector.
  • 要小心使用*選擇器。
  • Avoid CSS animation of box-shadow except on ::after and ::before pseudo-elements.
  • 避免框陰影的CSS動畫,除了::after和:before偽元素。
  • Be aware of which selector/rules aren't used.
  • 注意哪些選擇器/規則沒有被使用。
  • Be aware to use a single compiled stylesheet for an entire domain you should have very well-honed CSS skills.
  • 請注意,對於整個域使用一個編譯過的樣式表,您應該具有非常完善的CSS技能。
  • Avoid CSS class puking (class attributes on frigin everything).
  • 避免CSS類puking(所有類的類屬性)。
  • Avoid CSS position absolute and fixed on moderate or minor layout aspects; reserve for only major layout elements.
  • 避免CSS位置的絕對和固定在中度或小布局方面;只保留主要布局元素。
  • Minify your CSS when and wherever possible.
  • 盡可能的縮小CSS。
  • Reduce the number of HTTP requests.
  • 減少HTTP請求的數量。
  • Use third-party tools like Yahoo's YSlow and Google PageSpeed Insights for further insight.
  • 使用第三方工具,如雅虎的YSlow和谷歌頁面顯示的深入見解。

#3


7  

It won't have an impact on performance, however older browsers and non standard browsers may misinterpret the content within the elements when the type is not set. I have quite often used embedded blocks with a type element, and haven't seen an issue when using common browsers, IE, Chrome, Firefox or Safari.

它不會對性能造成影響,但是老式瀏覽器和非標准的瀏覽器可能誤解元素中的內容時沒有設置類型。我經常使用嵌入塊類型元素,沒見過一個問題,當使用常見的瀏覽器,即Chrome,Firefox和Safari。

#4


4  

As you already said in the your question the default type is 'text/css', which means if the type attribute isn't present the browser uses 'text/css'.

正如您在問題中已經提到的,默認類型是“text/css”,這意味着如果類型屬性不存在,瀏覽器將使用“text/css”。

For browsers based on the webkit engine, it's actually faster to omit the type attribute because it first checks for the type to be empty. Therefore if you don't omit the type the browser have to at least do 1 more check. (The check if the provided type is matching text/css).

對於基於webkit引擎的瀏覽器,省略類型屬性實際上更快,因為它首先檢查類型為空。因此,如果您不省略該類型,瀏覽器必須至少再做一次檢查。(檢查提供的類型是否匹配文本/css)。

I could imagine other browsers (not based on webkit) are implementing the css check likely the same. Because for checking an empty string is "easier" from the CPU's point of view (in the case of a webkit based browser it's an AtomicString from the webkit engine).

我可以想象其他瀏覽器(不是基於webkit)也在實現css檢查。因為從CPU的角度來看,檢查空字符串“更容易”(在基於webkit的瀏覽器中,它是來自webkit引擎的AtomicString)。

You can find the css check inside the webkit engine implementation. Can also be found inside the chromium implementation.

您可以在webkit引擎實現中找到css檢查。也可以在chromium實現中找到。

#5


3  

According to HTML5 the default type for style is text/css and the default type for the script tag is text/javascript,Even if you dint specify, they will consider the defaults. so that there wont be any performance issue for not mentioning the type considering most modern browsers

根據HTML5,樣式的默認類型是文本/css,腳本標簽的默認類型是文本/javascript,即使你沒有指定,他們也會考慮默認值。因此,考慮到大多數現代瀏覽器,不提及類型不會有任何性能問題

#6


2  

The main purpose of the type="text/css" is Set the value of the type attribute to indicate the language of the linked (style sheet) resource. This allows the user agent to avoid downloading a style sheet for an unsupported style sheet language. (www.w3.org)

type=“text/css”的主要目的是設置type屬性的值,以指示鏈接(樣式表)資源的語言。這允許用戶代理避免為不支持的樣式表語言下載樣式表。(www.w3.org)

so basically, it can only reduce the page load by avoiding render blocking files to be downloaded. so its safe to say that, using type attribute to specify the stylesheet type could sometimes increase the pagespeed.

因此,基本上,它只能通過避免要下載的呈現阻塞文件來減少頁面加載。因此,可以肯定地說,使用type屬性指定樣式表類型有時會增加pagespeed。

#7


2  

I think it should have an impact, even though it's optional.

我認為它應該有影響,即使它是可選的。

Let us consider both cases:

讓我們考慮這兩種情況:

  1. Case 1: type is present
    While parsing html document browser will parse style tag and read type attribute and will know the format of the file. It will check the support for type and start download.
  2. 案例1:在解析html文檔瀏覽器時,類型是存在的,它將解析樣式標簽和讀取類型屬性,並知道文件的格式。它將檢查對類型的支持並開始下載。
  3. Case 2: type is not present
    While parsing html document browser will parse style tag and check type attribute.Since it doesn't have a type attribute it will check default type saved in browser settings and try to download the file based on the default settings.
  4. 案例2:解析html文檔瀏覽器將解析樣式標記並檢查類型屬性時不存在類型。由於它沒有類型屬性,它將檢查保存在瀏覽器設置中的默認類型,並嘗試根據默認設置下載文件。

Now the additional step of checking the default settings and applying those should take additional time in case 2. So I would say there's a performance impact but it's really negligible. Specifying type should increase performance.

現在,檢查默認設置並應用這些設置的附加步驟應該需要額外的時間。所以我認為這對性能有影響,但這是可以忽略的。指定類型應該提高性能。

#8


0  

Since the introduction of HTML 5.x, it's no longer required, if your clients browser have already support HTML5, then you can just omit that one.

自從HTML 5的引入。x,它不再是必需的,如果你的客戶端瀏覽器已經支持HTML5,那么你可以省略它。

#9


0  

This is optional in latest versions, including or excluding the tag does not matter because it is default but including this Tag is not a bad idea because it will help the browsers to identify the script easily- especially old versioned.

這在最新版本中是可選的,包括或排除標記並不重要,因為它是默認的,但是包含這個標記不是一個壞主意,因為它將幫助瀏覽器輕松地識別腳本——特別是舊版本。

#10


0  

Simple answer: Nope :)

簡單的答案:不:)

It's like a human saying "Hey. How you doing?" instead of "Hey. How are you doing?"... Your brain knows what you trying to say and it doesn't take extra time for you to understand the sentence.

這就像一個人在說“嘿”。你過得怎么樣?你好嗎?”…你的大腦知道你想說什么,你不需要花額外的時間去理解這個句子。

#11


0  

Normally it has no performance cost and with html 5 there should be no problem either its better to not declare it then to set the wrong type

通常它沒有性能成本,使用html 5也應該沒有問題,最好不要聲明它,然后設置錯誤的類型

#12


-1  

As per MDN

根據MDN

type attribute is optional and defaults to text/css.

類型屬性是可選的,默認為文本/css。

So need not to worry about the performance cost, if not declaring type="text/css" in the <style> element?

因此,如果不在


注意!

本站翻译的文章,版权归属于本站,未经许可禁止转摘,转摘请注明本文地址:https://www.itdaan.com/blog/2017/09/21/7252e4b585073f445244555e6f151f11.html



Can I skip attribute “type” in “style” tag in HTML5? [duplicate] Use rowspan attribute in
 
粤ICP备14056181号  © 2014-2021 ITdaan.com