charset 헤드 탭에서의 행동
6177 단어 HTML
이번에는 브라우저에서 문자 코드의 해석, 행위에 대한 의문을 조사한 결과를 총결하였다.
아이구
기준 WHATWG 규격서<script> 라벨은 기본적으로 html의 투시를 멈추고 js의 다운로드와 실행을 진행합니다.
따라서 우리 프론트 데스크 엔지니어는 잠시 async과defer를 사용하여 속도를 높인다
그래서 의심하기 시작했어요.charset="utf-8" 전에utf-8로 기술한 <script>을 방치한 경우 코드가 엉망이 되지 않습니까?열다
※ locale langage가 ja(일본어)인 경우 기본 문자 코드는 shift-jis->WHATWG 규격서
확인
확인하기 위해 아래의 코드를 적절하게 준비하였다
index.html<!DOCTYPE html>
<html lang="ja">
<head>
<script src="foo.js"></script> <!-- utf-8 -->
<script src="bar.js"></script> <!-- shift-jis -->
<meta charset="utf-8">
</head>
<body></body>
</html>
foo.jsalert('アラート1'); // utf-8
bar.jsalert('アラート2'); // shift-jis
결과
미결제
이유는
The user agent may wait for more bytes of the resource to be available, either in this step or at any later step in this algorithm. For instance, a user agent might wait 500ms or 1024 bytes, whichever came first. In general preparsing the source to find the encoding improves performance, as it reduces the need to throw away the data structures used when parsing upon finding the encoding information. However, if the user agent delays too long to obtain data to determine the encoding, then the cost of the delay could outweigh any performance improvements from the preparse.
이렇게 하면 영어를 못 알아보고 대충 설명했다
1024byte는 사전 수사로 나뉘어 있으며, 만약 그곳에 문자 코드의 지정이 사용된다면
느낌인 것 같아.배웠어.
추가 검증
500ms/1024byte 이후<chaeset>면 사이즈가 안 바뀌나요?그래서 추가 검증을 했다.
크롬이 너무 똑똑해서 IE로 했어요.
index.html<!DOCTYPE html>
<html lang="ja">
<head>
<script src="foo.js"></script> <!-- utf-8 -->
<script src="bar.js"></script> <!-- shift-jis -->
<script>// byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi</script>
<script>// byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi</script>
<script>// byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi</script>
...
<meta charset="utf-8">
</head>
<body></body>
</html>
이렇게 바이트 수로 돈 벌기.
실행 결과
미해석 <charset> alart 을 실행한 후 문자 코드를 정확하게 해석한 것으로 다시 표시alart, 총 4회 경고 표시
실행 중인 콘솔을 확인했습니다. 두 번째 alart 이후
, 해석기가 문자 코드를 설명하는 장소에서 처음부터 다시 실행합니다.
총괄하다 <charset> 이전에 script를 가입하면 이중 방식으로 실행될 수 있습니다
성능에 적지 않은 영향을 미치기 때문에 측정계라면 중복 발송되어 번거롭지 않을 것이다
기본적으로 무슨 일이 있어도 처음<charset>이 좋다
Reference
이 문제에 관하여(charset 헤드 탭에서의 행동), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/sumtrue/items/43470d476cd5b0f49a35
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
확인하기 위해 아래의 코드를 적절하게 준비하였다
index.html
<!DOCTYPE html>
<html lang="ja">
<head>
<script src="foo.js"></script> <!-- utf-8 -->
<script src="bar.js"></script> <!-- shift-jis -->
<meta charset="utf-8">
</head>
<body></body>
</html>
alert('アラート1'); // utf-8
alert('アラート2'); // shift-jis
결과
미결제
이유는
The user agent may wait for more bytes of the resource to be available, either in this step or at any later step in this algorithm. For instance, a user agent might wait 500ms or 1024 bytes, whichever came first. In general preparsing the source to find the encoding improves performance, as it reduces the need to throw away the data structures used when parsing upon finding the encoding information. However, if the user agent delays too long to obtain data to determine the encoding, then the cost of the delay could outweigh any performance improvements from the preparse.
이렇게 하면 영어를 못 알아보고 대충 설명했다
1024byte는 사전 수사로 나뉘어 있으며, 만약 그곳에 문자 코드의 지정이 사용된다면
느낌인 것 같아.배웠어.
추가 검증
500ms/1024byte 이후<chaeset>면 사이즈가 안 바뀌나요?그래서 추가 검증을 했다.
크롬이 너무 똑똑해서 IE로 했어요.
index.html<!DOCTYPE html>
<html lang="ja">
<head>
<script src="foo.js"></script> <!-- utf-8 -->
<script src="bar.js"></script> <!-- shift-jis -->
<script>// byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi</script>
<script>// byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi</script>
<script>// byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi</script>
...
<meta charset="utf-8">
</head>
<body></body>
</html>
이렇게 바이트 수로 돈 벌기.
실행 결과
미해석 <charset> alart 을 실행한 후 문자 코드를 정확하게 해석한 것으로 다시 표시alart, 총 4회 경고 표시
실행 중인 콘솔을 확인했습니다. 두 번째 alart 이후
, 해석기가 문자 코드를 설명하는 장소에서 처음부터 다시 실행합니다.
총괄하다 <charset> 이전에 script를 가입하면 이중 방식으로 실행될 수 있습니다
성능에 적지 않은 영향을 미치기 때문에 측정계라면 중복 발송되어 번거롭지 않을 것이다
기본적으로 무슨 일이 있어도 처음<charset>이 좋다
Reference
이 문제에 관하여(charset 헤드 탭에서의 행동), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/sumtrue/items/43470d476cd5b0f49a35
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
500ms/1024byte 이후
<chaeset>면 사이즈가 안 바뀌나요?그래서 추가 검증을 했다.크롬이 너무 똑똑해서 IE로 했어요.
index.html
<!DOCTYPE html>
<html lang="ja">
<head>
<script src="foo.js"></script> <!-- utf-8 -->
<script src="bar.js"></script> <!-- shift-jis -->
<script>// byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi</script>
<script>// byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi</script>
<script>// byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi byte kasegi</script>
...
<meta charset="utf-8">
</head>
<body></body>
</html>
실행 결과
미해석
<charset> alart 을 실행한 후 문자 코드를 정확하게 해석한 것으로 다시 표시alart, 총 4회 경고 표시실행 중인 콘솔을 확인했습니다. 두 번째
alart 이후 , 해석기가 문자 코드를 설명하는 장소에서 처음부터 다시 실행합니다.
총괄하다 <charset> 이전에 script를 가입하면 이중 방식으로 실행될 수 있습니다
성능에 적지 않은 영향을 미치기 때문에 측정계라면 중복 발송되어 번거롭지 않을 것이다
기본적으로 무슨 일이 있어도 처음<charset>이 좋다
Reference
이 문제에 관하여(charset 헤드 탭에서의 행동), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/sumtrue/items/43470d476cd5b0f49a35
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
Reference
이 문제에 관하여(charset 헤드 탭에서의 행동), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/sumtrue/items/43470d476cd5b0f49a35텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
