태터데스크 관리자

도움말
닫기
적용하기   첫페이지 만들기

태터데스크 메시지

저장하였습니다.
   情  
Front Page
Tag | Location | Media | Guestbook | Admin   
 
[Silverlight] Browser에서 Silverlight를 실행하기까지의 과정

Browser는 Silverlight를 언제, 어떻게 다운로드하고 실행할까요? HTML을 구성하는 모든 DOM요소가 Parsing되고 나서 Silverlight가 읽히는 걸까요? 만약 Silverlight를 Initialize하는 정보를 HTML페이지에 둬야 한다면 언제 어디에 둬야 할까요?

이 모든 궁금증을 해결하기 위해 실험을 진행하였으며, 그 페이지 구조와 소스 코드는 다음과 같습니다.

HTML Page
Head Area
Body Area
HTML Code Or Resource
Silverlight Area
App
Other Page
Html Code Or Resource
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >

<head>
    <!-- Check Read Head Area -->
    <script> alert("HTML : Load Header"); </script>
    <title>Silverlight Test</title>
    <script type="text/javascript" src="Silverlight.js"></script>
</head>
<body>
    <form id="frm" runat="server" style="height:100%">
    <!-- Check Read Pre Silverlight Resource -->
    <script> alert("HTML : Before Load Image1"); </script>
    <img src="Images/whale.jpg" style="width: 100px; height: 100px;" />
    <script> alert("HTML : After Load Image1"); </script>

    <!-- Check Read Silverlight Resource -->    
    <div id="silverlightControlHost" style="height: 300px; width: 100%;">
        <script> alert("HTML : Before silverlight object"); </script>
        <object data="data:application/x-silverlight-2," type="application/x-silverlight-2">
          <param name="source" value="ClientBin/Test.xap"/>
          <param name="onError" value="onSilverlightError" />
          <param name="background" value="white" />
          <param name="minRuntimeVersion" value="3.0.40624.0" />
          <param name="autoUpgrade" value="true" />
          <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40624.0" style="text-decoration:none">
              <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style:none"/>
          </a>
        </object>
        <script> alert("HTML :After silverlight object 1"); </script>
        <iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe>
    </div>

    <!-- Check Read Resource After Silverlight -->
    <script> alert("HTML : Before Load Image2"); </script>
    <img src="Images/whale.jpg" style="width: 100px; height: 100px;" />
    <script> alert("HTML : After Load Image2"); </script>
    
    </form>
</body>
</html>

HTML 페이지의 각 주요 부분에 Alert Message를 나타내는 코드를 삽입함으로써 순서를 확인합니다. Test.xap라는 Silverlight 개체 내부에도 주요 이벤트와 생성자에 MessageBox.Show()를 두었습니다.

출력된 Message를 그대로 나열하면 다음과 같습니다. 이는 FF3, IE8에서 실행한 출력결과 값입니다.

  1. HTML : Load Header
  2. HTML : Before Load Image1
  3. HTML : After Load Image2
    //여기까지는 단순합니다. 순차적으로 HTML코드를 실행합니다. 다만 Image와 같은 외부 Resource를 만나면 이 때부터 다운로드가 시작됩니다.
  4. HTML : Before silverlight object
  5. Silverlight : App 생성자 실행
  6. Silverlight : InitializeComponent 실행
  7. Silverlight : App Xaml 로드
  8. Silverlight : App 생성자 종료
  9. Silverlight : App StartUp Event 실행
  10. Silverlight : this.RootVisual 실행
  11. Silverlight : RootVisual 개체 생성자 실행
  12. SIlverlight : App StartUp Event 종료
    //xap파일이 다운로드 되고, Silverlight.js에 의해서 Silverlight Plugin으로 읽혀지게 됩니다. 또한 한가지 주목할 점은 Silverlight가 읽혀지고 내부적으로 모든 초기화가 끝나야 Silverlight 다음의 HTML문의 해석이 시작된다는 점입니다.
  13. HTML :After silverlight object 1
  14. HTML : Before Load Image2
  15. HTML : After Load Image2

위의 결과를 종합적으로 판단해보면 다음과 같은 몇 가지 결론이 도출됩니다.

  1. 브라우저는 HTML페이지만을 먼저 다운로드하며, 각 HTML코드를 해석하고 HTML Code가 가리키는 자원들을 다운로드 및 로드 합니다.
  2. Silverlight 개체가 초기화 될 때 외부의 자원을 참조하려면, 해당 외부 자원이 Silverlight 개체 보다 먼저 초기화 될 수 있도록 해당 Silverlight 개체 보다 위쪽에 기술해야 합니다.
  3. Silverlight 개체의 초기화가 모두 완료된 후에 Silverlight 개체 다음 HTML 코드 해석을 시작합니다.

다음에는 서버에서 출력한 Cookie나 각 인증서 또는 암호화 자원 등이 어느 시점에 어디에서 초기화되고 관리되는지 파악해야겠네요.

신고
크리에이티브 커먼즈 라이선스
Creative Commons License
Tag :
Commented by Favicon of http://godffs.tistory,com BlogIcon Godffs at 2011.05.19 10:13 신고  r x
좋은정보 감사합니다.

name    password    homepage
 hidden


 Category
분류 전체보기 (95)
Netwrok & Security (6)
Web Development (61)
Database (5)
Framework (6)
Others (17)
About (0)
 TAGS
WCF data tier maxRecievedMessageSize class id 차이 SourceSafe2005 리눅스 ie6 자바스크립트 버그 It's me 오라클 ASP php c#.net 영국 학원 linux DTD 특수문자 UpdateProgress exception id name 차이 smarty RFC 4180 ASP.NET 영국 인턴쉽 MS SQL Server Blog API ajax XML PHP 강좌 ATRIX mantis bug tracker mantis SourceSafe Internet Silverlight 오라클 구조 application error #401 web tier ebnf LiveMail 자바스크립트 영국 홈스테이
 Calendar
«   2017/06   »
        1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30  
 Visitor Statistics
Total : 241,119
Today : 2
Yesterday : 56
rss
 

티스토리 툴바