KR20140117122A - 전자장치에서 동적으로 변하는 웹페이지 내용을 제어하는 방법 및 장치 - Google Patents

전자장치에서 동적으로 변하는 웹페이지 내용을 제어하는 방법 및 장치 Download PDF

Info

Publication number
KR20140117122A
KR20140117122A KR1020130032112A KR20130032112A KR20140117122A KR 20140117122 A KR20140117122 A KR 20140117122A KR 1020130032112 A KR1020130032112 A KR 1020130032112A KR 20130032112 A KR20130032112 A KR 20130032112A KR 20140117122 A KR20140117122 A KR 20140117122A
Authority
KR
South Korea
Prior art keywords
web page
content
contents
data structure
change
Prior art date
Application number
KR1020130032112A
Other languages
English (en)
Inventor
김경태
이창호
Original Assignee
삼성전자주식회사
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 삼성전자주식회사 filed Critical 삼성전자주식회사
Priority to KR1020130032112A priority Critical patent/KR20140117122A/ko
Priority to JP2014062494A priority patent/JP6027568B2/ja
Priority to US14/224,235 priority patent/US20140298159A1/en
Priority to PCT/KR2014/002475 priority patent/WO2014157899A1/en
Priority to CN201410116669.7A priority patent/CN104077348A/zh
Priority to EP14161794.4A priority patent/EP2784702A1/en
Priority to AU2014201798A priority patent/AU2014201798B2/en
Publication of KR20140117122A publication Critical patent/KR20140117122A/ko

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/12—Use of codes for handling textual entities
    • G06F40/14—Tree-structured documents
    • G06F40/143—Markup, e.g. Standard Generalized Markup Language [SGML] or Document Type Definition [DTD]
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/904—Browsing; Visualisation therefor
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/957—Browsing optimisation, e.g. caching or content distillation
    • G06F16/9574—Browsing optimisation, e.g. caching or content distillation of access to content, e.g. by caching
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • G06F16/986—Document structures and storage, e.g. HTML extensions
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F17/00—Digital computing or data processing equipment or methods, specially adapted for specific functions
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/14—Digital output to display device ; Cooperation and interconnection of the display device with other functional units

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Data Mining & Analysis (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Human Computer Interaction (AREA)
  • Health & Medical Sciences (AREA)
  • Artificial Intelligence (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Software Systems (AREA)
  • Mathematical Physics (AREA)
  • Information Transfer Between Computers (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

전자장치에서 웹페이지 내에 동적 콘텐츠의 디스플레이를 제어하는 방법은, 웹페이지 내에 동적 콘텐츠가 포함되어 있을 때, 설정된 시점에서 상기 웹페이지에 대응하는 데이터 구조의 내용을 저장하는 과정과, 특정 시점의 상기 웹페이지에 대응하는 데이터 구조의 내용을 독출 하는 이벤트가 발생할 시, 상기 저장된 웹페이지에 대응하는 데이터 구조의 내용을 독출하여 디스플레이하는 과정을 포함하여, 사용자가 동적으로 변하는 웹페이지의 내용을 검색할 수 있는 이점이 있다.

Description

전자장치에서 동적으로 변하는 웹페이지 내용을 제어하는 방법 및 장치{METHOD AND APPARATUS FOR CONTROLLING CONTENTS OF WEB PAGE TO BE CHANGED DYNAMICALLY IN ELECTRONIC DEVICE}
본 발명은 일반적으로 전자장치에 관한 것으로, 특히 전자장치에서 동적으로 변하는 웹페이지 내용을 제어하는 방법 및 장치에 관한 것이다.
도 1의 (a) 내지 (e)는 종래기술에 따른 웹브라우징 과정 중 웹페이지 내에 특정 내용이 동적으로 변하는 시나리오를 도시하고 있다.
도 1의 (a) 내지 (e)을 참조하면, 특정 포털사이트의 "뉴스" 항목에 수초 단위로 주요 뉴스 내용가 변경되어 디스플레이된다. 예를 들어, 하나의 웹페이지의 뉴스 항목이 "내용 AAA"(100), "내용 BBB"(110), "내용 CCC"(112), "내용 DDD"(114), 그리고 "내용 EEE"(116)까지 순환되어 디스플레이된다. 비록 하나의 뉴스 항목 내용이 동적으로 변하는 경우를 설명하지만, 하나의 웹페이지 내에서 다수 항목 각각의 내용들이 동적으로 변하여 디스플레이될 수도 있다.
한편, 도 1에서처럼 뉴스 항목 같은 웹페이지 내용이 동적으로 변하는 환경에서, 사용자가 "내용 AAA"(100)를 보고 싶을 때, 웹브라우저 내에 동적으로 변하는 웹페이지의 특정 내용을 제어하기 위한 별도의 컨트롤러를 제공하지 않고 있기 때문에, 사용자는 웹페이지의 뉴스 항목에 "내용 AAA"(100)가 디스플레이될 때까지 기다려야한다. 예를 들어, 현재 뉴스 항목에 "내용 CCC"(112)이 디스플레이되는 시점에, 사용자가 "내용 AAA"(100)에 해당하는 뉴스 기사를 보고자할 때, "내용 DDD"(114) 및 "내용 EEE"(116)이 디스플레이되고 다시 "내용 AAA"(100)가 화면에 디스플레이될 때까지 기다려야 한다. 경우에 따라, "내용 AAA"(100)가 다시 디스플레이되지 않고, "내용 FFF"(도시하지 않음)로 대체되는 경우도 있다.
상술한 바와 같이, 종래 웹브라우저에서 웹페이지 내용이 동적으로 변할 때, 사용자가 원하는 특정 내용으로 이동시키는 제어수단을 제공하기 않기 때문에 사용자가 원하는 특정 내용을 놓치는 경우가 종종 발생한다.
따라서, 웹브라우저에서 동적으로 변하는 웹페이지 내용의 디스플레이를 제어하기 위한 방법 및 장치가 필요하다.
본 발명의 목적은 전자장치에서 동적으로 변하는 웹페이지 내용을 제어하는 방법 및 장치를 제공함에 있다.
본 발명의 다른 목적은 웹브라우저에서 동적으로 변하는 웹페이지 내용을 제어하는 방법 및 장치를 제공함에 있다.
본 발명의 또 다른 목적은 동적으로 변하는 웹페이지 내용을 일시정지/재생, 웹페이지의 이전 내용으로 돌아가기 및 웹페이지의 다음 내용으로 돌아가기 같은 컨트롤러를 사용하여, 사용자에게 원하는 웹페이지의 내용을 제공하는 방법 및 장치를 제공함에 있다.
본 발명의 또 다른 목적은 사용자가 동적으로 변하는 웹페이지의 내용을 놓치지 않도록 하는 방법 및 장치를 제공함에 있다.
상기한 목적들을 달성하기 위한 본 발명의 제 1 견지에 따르면, 전자장치에서 웹페이지 내에 동적 콘텐츠의 디스플레이를 제어하는 방법에 있어서, 웹페이지 내에 동적 콘텐츠가 포함되어 있을 때, 설정된 시점에서 상기 웹페이지에 대응하는 데이터 구조의 내용을 저장하는 과정과, 특정 시점의 상기 웹페이지에 대응하는 데이터 구조의 내용을 독출 하는 이벤트가 발생할 시, 상기 저장된 웹페이지에 대응하는 데이터 구조의 내용을 독출하여 디스플레이하는 과정을 포함한다.
상기한 목적들을 달성하기 위한 본 발명의 제 2 견지에 따르면, 전자장치의 동작방법은, 웹브라우저의 제1 명령에 따라, 현재 디스플레이되는 웹페이지 내에서 특정 콘텐츠의 디스플레이를 요청받는 과정과, 여기서, 상기 웹페이지를 렌더링하기 위한 데이터구조가 메모리에 저장되고, 상기 특정 콘텐츠를 포함한 상기 웹페이지에 대응하는 상기 데이터구조의 변경내용을 이용하여, 상기 특정 콘텐츠를 포함한 상기 웹페이지를 디스플레이하는 과정을 포함한다.
상기한 목적들을 달성하기 위한 본 발명의 제 3 견지에 따르면, 하나 이상의 프로세서; 메모리; 및 상기 메모리에 저장되어 있으며 상기 하나 이상의 프로세서에 의하여 실행되도록 구성되는 하나 이상의 프로그램을 포함하는 전자장치로서, 상기 프로그램은, 웹페이지 내에 동적 콘텐츠가 포함되어 있을 때, 설정된 시점에서 상기 웹페이지에 대응하는 데이터 구조의 내용을 저장하고, 특정 시점의 상기 웹페이지에 대응하는 데이터 구조의 내용을 독출 하는 이벤트가 발생할 시, 상기 저장된 웹페이지에 대응하는 데이터 구조의 내용을 독출하여 디스플레이하는 명령어들을 포함한다.
상기한 목적들을 달성하기 위한 본 발명의 제 4 견지에 따르면, 전자장치의 동작방법은, 웹페이지를 디스플레이하는 과정과, 여기서, 상기 웹페이지를 렌더링하기 위한 데이터구조가 메모리에 저장되고, 상기 웹페이지 내에서 특정 주기에 따라 변하는 콘텐츠가 있을 때, 변화시점마다 상기 메모리에 로딩되어 있는 상기 데이터구조의 변화내용을 저장하는 과정과, 상기 웹페이지 내에 변하는 내용의 디스플레이를 제어하는 이벤트가 발생할 시, 기록된 상기 데이터구조의 변화내용을 이용하여, 상기 이벤트에 대응하는 내용을 포함하는 상기 웹페이지를 디스플레이하는 과정을 포함한다.
상기한 목적들을 달성하기 위한 본 발명의 제 5 견지에 따르면, 하나 이상의 프로세서; 메모리; 및 상기 메모리에 저장되어 있으며 상기 하나 이상의 프로세서에 의하여 실행되도록 구성되는 하나 이상의 프로그램을 포함하는 전자장치로서, 상기 프로그램은, 웹브라우저의 제1 명령에 따라, 현재 디스플레이되는 웹페이지 내에서 특정 콘텐츠의 디스플레이를 요청받고, 여기서, 상기 웹페이지를 렌더링하기 위한 데이터구조가 메모리에 저장되고, 상기 특정 콘텐츠를 포함한 상기 웹페이지에 대응하는 상기 데이터구조의 변경내용을 이용하여, 상기 특정 콘텐츠를 포함한 상기 웹페이지를 디스플레이하는 명령어를 포함한다.
상기한 목적들을 달성하기 위한 본 발명의 제 6 견지에 따르면, 하나 이상의 프로세서; 메모리; 및 상기 메모리에 저장되어 있으며 상기 하나 이상의 프로세서에 의하여 실행되도록 구성되는 하나 이상의 프로그램을 포함하는 전자장치로서, 상기 프로그램은, 웹페이지를 디스플레이하고, 여기서, 상기 웹페이지를 렌더링하기 위한 데이터구조가 메모리에 저장되고, 상기 웹페이지 내에서 특정 주기에 따라 변하는 콘텐츠가 있을 때, 변화시점마다 상기 메모리에 로딩되어 있는 상기 데이터구조의 변화내용을 저장하고, 상기 웹페이지 내에 변하는 내용의 디스플레이를 제어하는 이벤트가 발생할 시, 기록된 상기 데이터구조의 변화내용을 이용하여, 상기 이벤트에 대응하는 내용을 포함하는 상기 웹페이지를 디스플레이하는 명령어를 포함한다.
상술한 바와 같이, 본 발명은 웹페이지에서 동적으로 변하는 웹페이지의 적어도 일부 내용을 일시정지/재생, 이전 웹페이지 내용으로 돌아가기 및 다음 웹페이지 내용으로 돌아가기 등과 같은 컨트롤러를 제공함으로써, 사용자가 동적으로 변하는 웹페이지의 내용을 검색할 수 있는 이점이 있다. 또한, 사용자는 동적으로 변하는 웹페이지의 내용을 놓치지 않고 쉽게 파악할 수 있다.
도 1은 종래기술에 따른 웹브라우징 과정 중 웹페이지 내에 특정 내용이 동적으로 변경되는 시나리오를 도시한 도면,
도 2는 본 발명의 실시 예에 따른 웹브라우징 중 웹페이지 내에 특정 내용이 동적으로 변경되는 시나리오를 도시한 도면,
도 3의 (a) 및 (c)는 본 발명의 실시 예에 따른 동적으로 변하는 웹페이지 내용의 디스플레이를 제어하기 위한 웹브라우저의 툴바를 도시한 도면;
도 3의 (b) 및 (d)는 본 발명의 실시 예에 따른 동적으로 변하는 웹페이지 내용의 디스플레이를 제어하기 위한 웹브라우저의 선택메뉴(selection menu)를 도시한 도면;
도 4는 본 발명의 실시 예에 따른 웹브라우저의 구성요소를 도시한 도면;
도 5는 본 발명의 실시 예에 따른 웹 렌더링 엔진의 동작 과정을 도시한 도면;
도 6a는 본 발명의 실시 예에 따른 웹브라우저의 동작 과정을 도시한 도면;
도 6b는 본 발명의 실시 예에 따른 문서의 데이터 구조와 메모리 및 응용프로그램 사이의 관계를 도시한 도면;
도 7의 (a) 내지 (d)은 본 발명의 제1 실시 예에 따른 동적으로 변경되는 다수 웹페이지 내용에 대한 정보 기록 및 동적으로 변경되는 다수 웹페이지 내용의 디스플레이를 위한 타이밍 시나리오를 도시한 도면;
도 8의 (a) 내지 (b)은 본 발명의 제2 실시 예에 따른 동적으로 변경되는 다수 웹페이지 내용에 대한 정보 기록 및 동적으로 변경되는 다수 웹페이지 내용의 디스플레이를 위한 타이밍 시나리오를 도시한 도면;
도 9의 (a) 내지 (b)는 본 발명의 제3 실시 예에 따른 동적으로 변경되는 다수 웹페이지 내용에 대한 정보 기록 및 동적으로 변경되는 다수 웹페이지 내용의 디스플레이를 위한 타이밍 시나리오를 도시한 도면;
도 10의 (a) 내지 (c)은 본 발명의 실시 예에 따른 웹페이지 특정 내용이 변경하는 예를 도시한 도면;
도 11은 본 발명의 실시 예에 따른 웹페이지 내에 재생되는 플래시 동영상에 대한 정보를 기록하는 시나리오를 도시한 도면;
도 12는 본 발명의 실시 예에 따른 웹페이지 내에서 스크롤 이동으로 인한 화면상에서의 내용 위치 이동에 대한 정보를 기록하는 시나리오를 도시한 도면;
도 13은 본 발명의 제1 실시 예에 따른 동적으로 변하는 웹페이지 내용의 디스플레이를 제어하기 위한 흐름도를 도시한 도면;
도 14는 본 발명의 제2 실시 예에 따른 동적으로 변하는 웹페이지 내용의 디스플레이를 제어하기 위한 흐름도를 도시한 도면; 및
도 15는 본 발명의 실시 예에 따른 전자장치의 블록도.
이하 본 발명의 바람직한 실시 예를 첨부된 도면의 참조와 함께 상세히 설명한다. 그리고, 본 발명을 설명함에 있어서, 관련된 공지기능 혹은 구성에 대한 구체적인 설명이 본 발명의 요지를 불필요하게 흐릴 수 있다고 판단된 경우 그 상세한 설명은 생략할 것이다. 그리고 후술되는 용어들은 본 발명에서의 기능을 고려하여 정의된 용어들로서 이는 사용자, 운용자의 의도 또는 관례 등에 따라 달라질 수 있다. 그러므로 그 정의는 본 명세서 전반에 걸친 내용을 토대로 내려져야 할 것이다.
이하, 본 발명은 웹브라우저를 실행하는 전자장치에서 동적으로 변하는 웹페이지 내용을 제어하기 위한 방법 및 장치에 관해 설명하기로 한다.
특히, 웹페이지 내의 특정 내용 변경은, 상기 웹페이지에 해당하는 소스코드를 위한 자료구조 트리(예: DOM(Document Object Model) 트리, 렌더 트리(render tree))의 객체(또는 요소, 노드)의 위치, 크기, 속성 등의 변경 이후, 배치(layouting), 그리기(painting)를 다시 수행함으로써, 이루어진다.
도 2의 (a) 내지 (e)는 본 발명의 실시 예에 따른 웹브라우징 중 웹페이지 내에 특정 내용이 동적으로 변경되는 시나리오를 도시하고 있다.
상기 도 2(a) 내지 (e)을 참조하면, 특정 포털사이트의 "뉴스" 항목에 수초 단위로 주요 뉴스 내용이 변경되어 디스플레이된다. 예를 들어, 하나의 웹페이지의 뉴스 항목이 "내용 AAA", "내용 BBB", "내용 CCC", "내용 DDD", 그리고 "내용 EEE"까지 순환되어 디스플레이된다고 가정한다. 이때, "내용 AAA", "내용 BBB", "내용 CCC", "내용 DDD", 그리고 "내용 EEE"이 동적으로 변할 때, 웹페이지를 렌더링하기 위한 DOM 트리 구조 또는 렌더 트리 구조에 대한 정보가 기록된다. 이와 관련한 상세한 설명은 하기 도 5 및 도 6의 (a) 내지 6(b)에서 설명하기로 한다. 비록 상기 도 2의 (a) 내지 (e)에서 하나의 뉴스 항목 내용이 동적으로 변하는 경우를 설명하지만, 본 발명은 하나의 뉴스 항목에 제한되지 않으며 웹페이지 내에 다수 항목의 내용들이 동적으로 각각 변하는 경우에도 적용가능함은 물론이다.
도 2의 (a)와 같이, 전자 장치의 디스플레이 화면에 디스플레이 된 웹페이지의 적어도 일부의 내용이 "내용 AAA"에서 "내용 EEE"까지 반복되어 동적으로 나타날 때, 웹페이지의 내용 변경을 일시정지시키는 제어 메뉴(210)가 웹브라우저의 툴바(205)에 생성된다.
이때, 현재 뉴스 항목에 내용 BBB(200)가 디스플레이되며, 도 2의 (b)에서처럼 웹페이지의 뉴스 항목의 내용 변경을 제어할 수 있는 제어 메뉴(210)가 생성된다. 이러한 제어 메뉴(210)로는 현재 디스플레이되고 있는 해당 뉴스 항목의 내용 BBB(200)에서 일시정지할 수 있는 제어 버튼(211)이 생성될 수 있다. 이후, 사용자에 의해 제어 버튼(211)이 터치 될 시, 해당 뉴스 항목이 동적으로 변하는 것이 정지된다. 이때, 뉴스 항목의 내용 BBB(200) 다음에 디스플레이되는 내용 CCC, 내용 DDD, 내용 EEE, 내용 AAA(202)가 나타나지 않지만, 동적으로 변하는 내용 CCC, 내용 DDD, 내용 EEE, 내용 AAA(202)에 해당하는 DOM 트리 구조 또는 렌더 트리 구조에 관한 정보는 기록된다.
구현에 따라, 내용 BBB(200) 다음에 나타나야하는 내용 CCC, 내용 DDD, 내용 EEE, 내용 AAA(202)가 디스플레이되지 않고, 동적으로 변하는 내용 CCC, 내용 DDD, 내용 EEE, 내용 AAA(202)에 해당하는 DOM 트리 구조 또는 렌더 트리 구조에 관한 정보를 기록하는 것 역시 정지될 수 있다. 한편, 도 2의 (c) 및 (d)에 도시된 바와 같이, 웹페이지의 내용 변경을 일시정지할 수 있는 제어 버튼(211)이 터치되어 웹페이지의 내용 변경이 정지되면, 이전 웹페이지 내용으로 이동시킬 수 있는 제어 버튼(212) 및 다음 내용으로 이동시킬 수 있는 제어 버튼(213)이 웹브라우저의 툴바에 생성된다. 따라서, 웹페이지 이전 내용으로 이동시키기 위한 제어 버튼(212)이 사용자에 의해 터치 될 시, 웹페이지의 내용 BBB(200)의 이전 내용 즉, 내용 AAA(202)가 디스플레이된다.
또한, 뉴스 항목에 내용 AAA(202)가 디스플레이되고 있는 상태에서 다음 웹페이지 내용으로 이동시키기 위한 제어 버튼(213)이 사용자에 의해 터치 될 시, 웹페이지의 내용 AAA(202)의 다음 내용 즉, (e)에 도시된 바와 같은,내용 BBB(200)가 디스플레이된다.
그리고, 도 2의 (e)에 도시된 바와 같이, 웹페이지 내용 변경 재생을 위한 제어버튼(214)이 사용자에 의해 터치 되면, 다시 웹페이지 내용이 동적으로 변한다.
도 3a 및 도 3c 는 본 발명의 실시 예에 따른 웹브라우저를 위한 툴바를 도시하고 있다.
상기 도 3 a를 참조하면, 웹페이지의 내용이 동적으로 변하여 디스플레이될 때 웹브라우저의 툴바를 도시하고 있다. 이때, 웹브라우저를 위한 툴바(300)는 이전 웹페이지로 이동하기 위한 명령 버튼(310), 다음 웹페이지로 이동하기 위한 명령 버튼(311), 웹페이지 새로 고침에 해당하는 명령버튼(312), 검색창(314), 즐겨찾기(등록된 URL(Uniform Resource Locator) 표시)(316) 버튼, 중지 버튼(318), 검색 실행 버튼(320), 북마크(즐겨찾기에 URL 등록) 버튼(322) 및 본 발명에 따른 웹페이지의 적어도 일부의 내용 변경을 제어 하기 위하여 생성되는 제어 메뉴(330)을 포함한다. 즉, 전자 장치는 웹 브라우징 과정 중에 웹페이지가 생성되고, 해당 웹페이지의 적어도 일부의 내용이 동적으로 변경되는 것이 확인될 경우, 웹브라우저의 툴바(300)에 웹페이지의 내용이 동적으로 변경되는 것을 제어 하기 위한 제어 메뉴(330)가 생성될 수 있다. 더욱 상세하게도, 제어 메뉴(330)로는 웹페이지의 내용이 변경되는 것을 정지시키기 위한 정지 버튼(331)이 우선적으로 생성될 수 있다. 이는 상술한 웹페이지의 내용이 동적으로 변경되는 것이 정지된 후에 이하 동작을 수행하는 것이 바람직한데 기인한다.
여기서, 본 발명에 따라 생성된 제어 메뉴(330)의 정지버튼(331)은 웹페이지의 적어도 일부의 내용이 동적으로 변경되는 것을 정지시키는 기능이고, 툴방에 생성된 중지 버튼(318)은 로딩중인 웹페이지 전체의 디스플레이를 중지하는 기능이다.
상기 도 3 c를 참조하면, 웹페이지의 내용 변경을 정지시키기 위한 버튼(331)이 사용자에 의해 터치 될 때의 웹브라우저 툴바(300)를 도시하고 있다. 이때 웹브라우저 툴바(300)는 이전 웹페이지로 이동하기 위한 명령 버튼(310), 다음 웹페이지로 이동하기 위한 명령 버튼(311), 웹페이지 새로 고침에 해당하는 명령버튼(312), 검색창(314), 즐겨찾기(등록된 URL(Uniform Resource Locator) 표시)(316) 버튼, 중지 버튼(318), 검색 실행 버튼(320), 북마크(즐겨찾기에 URL 등록) 버튼(322)을 포함하며, 여기에, 본 발명에 따라 웹페이지의 적어도 일부의 내용이 동적으로 변경하는 것을 제어하기 위한 제어 메뉴(330)를 포함한다. 이러한 제어 메뉴(330)에는 웹페이지의 이전 내용으로 이동시키는 버튼(335), 웹페이지의 동적인 내용 변경을 다시 재생하는 버튼(340), 웹페이지의 다음 내용으로 이동시키는 버튼(345)을 포함한다.
한편, 상술한 제어 메뉴(330)에서 웹페이지의 동적인 내용 변경을 재생하는 버튼(340)이 다시 터치 될 시, 웹페이지의 이전 내용으로 이동시키는 버튼(335), 웹페이지의 동적인 내용 변경을 재생하는 버튼(340) 및 웹페이지의 다음 내용으로 이동시키는 버튼(345) 대신 웹페이지의 내용 변경을 정지시키기 위한 정지 버튼(331)이 툴바에 다시 나타날 수 있다. 본 발명의 실시예에서는 웹페이지의 툴바에 웹페이지의 적어도 일부 내용이 동적으로 변경되는 것을 제어하기 위한 제어 메뉴로써 정지 버튼이 우선적으로 생성되고, 정지 버튼이 실행되었을 경우, 그 이하의 버튼들(예를 들어, 웹페이지의 다음 해당 내용으로 이동하기 위한 버튼, 이전 해당 내용으로 이동하기 위한 버튼 및 동적 변경을 다시 재생시키는 버튼)이 순차적으로 생성되었다.
그러나 이에 국한되지 않으며, 이러한 버튼들은 전자 장치가 디스플레이된 웹페이지중 적어도 일부의 내용이 동적으로 변경됨을 확인할 경우, 웹브라우저의 툴바에 제어 메뉴로써 동시에 디스플레이될 수도 있을 것이다.
역시, 본 발명에서의 제어 메뉴로는 정지 버튼, 웹페이지의 다음 해당 내용으로 이동하기 위한 버튼, 이전 해당 내용으로 이동하기 위한 버튼 및 동적 변경을 다시 재생시키는 버튼만을 도시하고 설명하였으나, 동적으로 변경되는 다수의 내용들 중 가장 첫 번째의 내용으로 점핑하는 버튼, 가장 마지막 내용으로 점핑하는 버튼 등 공지의 다양한 이동 버튼들이 사용될 수 있을 것이다.
역시, 본 발명에서는 웹페이지의 적어도 일부의 내용이 동적으로 변경되는 것을 제어하기 위한 제어 메뉴가 툴바의 영역에 생성되었으나, 이에 국한되지 않으며, 웹페이지와 함께 변경되지 않는 전자 장치의 디스플레이 화면 어느 곳에도 생성될 수 있음은 자명하다.
도 3b 및 도 3d 는 본 발명의 실시 예에 따른 웹브라우저를 위한 선택메뉴를 도시하고 있다.
상기 도 3의 (b)는 상기 도 3의 (a)의 툴바(300)에 대응하는 선택메뉴를 도시하고 있다. 다시 말해, 툴바에 웹페이지의 내용 변경을 정지시키기 위한 정지 버튼(331)과 동일한 기능이 선택메뉴에 의해 실행될 수 있다. 예를 들어, 보기 메뉴(350)가 선택되면 웹페이지 내용 제어 메뉴 항목(351)이 나타나고, 웹페이지 내용 제어 메뉴 항목(351)이 선택되면 웹페이지 내용 변경 정지항목(352)이 나타난다.
마찬가지로, 상기 도 3의 (d)는 상기 도 3의 (c)의 툴바(300)에 대응하는 선택메뉴를 도시하고 있다. 다시 말해, 툴바(300)에 생성된 제어 메뉴(330)의 웹페이지의 이전 내용으로 이동시키는 버튼(335), 웹페이지의 동적인 내용 변경을 재생하는 버튼(340), 웹페이지의 다음 내용으로 이동시키는 버튼(345)과 동일한 기능이 선택메뉴에 의해 실행될 수 있다. 예를 들어, 보기 메뉴(360)가 선택되면 웹페이지 내용 제어 메뉴 항목(361)이 나타나고, 웹페이지 내용 제어 메뉴 항목(361)이 선택되면 이전 변경 내용의 웹페이지 이동 항목(362), 다음 변경 내용의 웹페이지 이동 항목(363) 및 웹페이지 내용 변경 재생 항목(364)이 동시에 나타날 수 있다.
도 4는 본 발명의 실시 예에 따른 웹브라우저의 구성요소를 도시하고 있다. 웹브라우저는 인터넷 익스플로러, 파이어폭스, 사파리, 크롬, 오페라 등을 포함한다. 웹브라우저의 주요 기능은 사용자가 선택한 자원을 서버에 요청하고 브라우저에 표시하는 것이다. 자원은 HTML(HyperText Markup Language) 또는 XML(eXtensible Markup Languag) 문서지만 경우에 따라 PDF나 이미지 또는 다른 형태일 수 있다. 자원의 주소는 URI(Uniform Resource Identifier)에 의해 정해진다. 브라우저는 소스코드(HTML 또는 XML 코드)와 CSS(cascading style sheets)에 따라 소스코드를 파싱하여 표시한다. 또한, 브라우저는 도 3(a) 내지 도 3(d)에서처럼, URI를 입력할 수 있는 주소 표시 줄, 이전 버튼과 다음 버튼, 북마크, 새로 고침 버튼, 현재 문서의 로드를 중단할 수 있는 정지 버튼, 홈 버튼, 그리고 본 발명에 더하여, 웹페이지 내용을 제어하기 위한 버튼들을 포함한다.
상기 도 4를 참조하면, 브라우저의 주요 구성 요소는 사용자 인터페이스(400), 브라우저 엔진(402), 렌더링 엔진(404), 통신(406), 자바스크립트 해석기(408), UI 백엔드(410), 자료저장소(412)를 포함한다.
사용자 인터페이스(400)는 주소 표시줄, 이전/다음 버튼, 북마크 메뉴 등, 웹페이지 내용을 제어하기 위한 버튼들. 요청한 페이지를 보여주는 창을 제외한 나머지 모든 부분이다.
브라우저 엔진(402)은 사용자 인터페이스(400)와 렌더링 엔진(404) 사이의 동작을 제어한다.
렌더링 엔진(404)은 요청한 콘텐츠를 표시. 예를 들어 HTML을 요청하면 HTML과 CSS를 파싱하여 화면에 표시한다.
통신(406)은 HTTP(hyper text transfer protocol) 요청과 같은 네트워크 호출에 사용된다. 또한, 통신(406)은 플랫폼과 독립적인 인터페이스이고 각 플랫폼 하부에서 실행된다.
UI 백엔드(410)는 렌더링 엔진(404)과 사용자 인터페이스(400)에 기반하여, 콤보 박스와 창 같은 기본적인 창을 그린다.
자바스크립트 해석기(408)는 자바스크립트 코드를 해석하고 실행한다.
자료 저장소(412)는 자료를 저장하는 계층으로서, 쿠키를 저장하는 것과 같이 모든 종류의 자원을 하드 디스크에 저장할 필요가 있다.
도 5는 본 발명의 실시 예에 따른 웹 렌더링 엔진(404)의 동작 과정을 도시하고 있다.
상기 도 5를 참조하면, 렌더링 엔진(404)의 역할은 요청받은 내용을 브라우저 화면에 디스플레이하는 것이다.
렌더링 엔진(404)은 화면에 HTML 및 XML 문서와 이미지를 표시할 수 있다. 또한, 플러그인이나 브라우저 확장 기능을 이용해 PDF와 같은 다른 유형도 표시할 수 있다.
렌더링 엔진(404)의 동작 과정을 보면, 렌더링 엔진(404)은 HTML 문서를 파싱하고 문서 내의 태그를 DOM 트리로 변환한다(500). 파싱으로 생성된 DOM 트리(b)는 HTML/XML 문서의 내용을 트리형태로 자료구조화 한 것이다. 그 다음 외부 CSS(Cascading Style Sheets) 파일과 함께 포함된 스타일 요소도 파싱한다. 여기서, DOM(Document Object Model) 트리 형태의 자료구조를 화면에 표시하기 위해 다른 형태의 데이터구조가 필요하다.
이를 위해, 스타일 정보와 HTML 표시 규칙은 "렌더 트리(render tree)"라고 칭하는 또 다른 트리를 생성한다(510). 상기 렌더 트리는 색상 또는 면적과 같은 시각적 속성이 있는 사각형을 포함하고 있는데 정해진 순서대로 화면에 표시된다.
렌더 트리 생성이 끝나면 배치(layout)가 시작되는데(520) 이것은 각 노드가 화면의 정확한 위치에 표시되는 것을 의미한다. 다시 말해, 각 렌더 객체는 화면에 표시될 위치나 크기를 가지고 있지 않으며, 배치를 통해 렌더 객체가 위치와 크기를 갖게 된다. 다음은 UI 백엔드(410)에서 렌더 트리를 탐색하면서 형상을 만들어내는 그리기 과정이 수행된다(530). 즉, 그리기 과정은 특정 메모리 공간에 RGB 값을 채우는 과정으로, 어느 위치에 어떤 크기로 그릴지, 어떤 색깔로 그릴지 자세한 내용이 기록된다.
도 6(a)은 본 발명의 실시 예에 따른 웹브라우저의 동작 과정을 도시하고 있다.
상기 도 6을 참조하면, 웹브라우저는 통신(406)을 통해 수신한 HTML/XML 코드(600)를 파싱하고(601) 파싱된 내용에 기반하여 DOM 트리를 구성한다(602). 즉, 파서(parser)(601)는 컴파일러(compiler)의 일부로서 HTML, XML 문서 등에서 마크업 태그(Markup Tag) 등을 입력받아 구문을 해석할 수 있는 단위로 여러 부분으로 분할해 주는 역할을 한다.
즉, 파서(Parser)(601)는 HTML 또는 XML 문서를 분석해 DOM 트리를 만들어낸다. DOM 문서는 노드(Node)들로 구성되며, 노드는 구성요소(Element), 텍스트(Text), 속성(Attribute) 혹은 다른 노드 타입(Nodetype)일 수 있다. DOM 트리의 경로는 DOM API(Application Program Interface)를 구성한다. 즉, 상기 DOM API는 구성요소와 텍스트 같은 HTML/XML 문서 안에 나타나는 모든 종류의 정보를 나타내는 인터페이스로써, 이러한 객체들을 다루는데 필요한 메서드와 속성들도 포함하고 있다.
여기서, DOM(603)은 HTML과 XML 문서를 위한 DOM API이라는 객체 트리구조로서 문서의 물리적 구조와 문서가 접근되고 다루어지는 방법을 정의한다. 또한, DOM(603)은 HTML 또는 XML 문서를 하나의 트리 구조로 본다. 구성요소(element)가 다른 구성요소에 포함되어 있는 것은, 하위 트리로 인식하고, 동등한 레벨에 있는 것은 형제 트리로 인식한다.
정리하면, DOM(630)은 다양한 환경과 애플리케이션에서 사용할 수 있는 표준적인 프로그래밍 인터페이스 제공하고, 프로그램 또는 스크립트를 통해 HTML이나 XML같은 웹 문서의 내용과 구조 그리고 스타일 정보의 검색 또는 수정이 가능하도록 해주는 플랫폼 또는 언어에 중립적인 인터페이스이다.
한편, Style Sheets(604)은 XML/HTML 문서(600)에 대한 시각적인 느낌, 형태나 모양, 색감, 디자인 등을 정리해 놓은 시트로써, CSS(Cascading Style Sheets) 파일 형태로 저장된다.
즉, HTML은 문서의 구조와 의미만을 나타내는데 사용해야 하기 때문에 해당 HTML 페이지의 디자인적인 모든 요소들은 따로 분리되어 Style Sheets(604)라는 별도의 파일로 기저장된다.
스타일 시트는 브라우저가 제공하는 기본 스타일 시트인데 페이지 제작자 또는 사용자도 이를 제공할 수 있다. 브라우저는 사용자가 선호하는 스타일을 정의할 수 있도록 지원한다.
CCS 파서(605)는 CSS 파일은 스타일 시트 객체로 파싱되고 각 객체는 CSS 사용규칙(606)을 포함한다.
어태치먼트(attachment)(607)는 스타일을 결정하고 렌더러를 만드는 과정으로, 모든 DOM 트리의 노드에는 "attach" 메서드가 있다. 어태치먼트(607)는 DOM 트리에 노드가 추가되면 새 노드의 "attach" 메서드를 호출한다.
한편, DOM 트리(602)가 구축되는 동안 브라우저는 렌더 트리(608)를 구축한다. 렌더 트리 구축(608)하는 목적은 객체가 화면에 표시되는 순서와 문서의 시각적인 구성 요소로써 올바른 순서로 내용을 그려낼 수 있도록 하기 위한 목적이 있다.
렌더 트리를 구축하려면 각 객체의 시각적 속성에 대한 계산이 필요한데 이것은 각 구성요소의 스타일 속성을 계산함으로써 처리된다. 상기 구성요소는 "형상(frames)", "렌더러(renderer)" 또는 "렌더 객체(render object)"라는 용어로 불리기도 한다. 상기 렌더러는 자신과 자식 요소를 어떻게 배치하고 그려내야 하는지 알고 있다. 각 렌더러는 스타일 규칙(606)에 따라 노드의 CSS 박스에 부합하는 사각형을 표시한다. 각 렌더러는 너비, 높이 그리고 위치와 같은 기하학적 정보를 포함한다.
렌더러가 생성되어 렌더 트리에 추가될 때 크기와 위치 정보는 없는데 이런 값을 계산하는 것을 배치(609)(layout) 또는 리플로(reflow)라고 부른다.
그리기(610) 단계에서는 화면에 내용을 표시(611)하기 위한 렌더 트리가 탐색되고 렌더러의 "paint" 메서드가 호출된다. 그리기(610)는 UI 기반의 구성 요소를 사용한다.
도 6(b)은 본 발명의 실시 예에 따른 문서의 데이터 구조와 메모리 및 응용프로그램 사이의 관계를 도시하고 있다.
상기 도 6(b)을 참조하면, HTML 또는 XML 문서(600)를 파싱한 후(601, 605), 해석 결과를 메모리에 DOM이라는 객체 트리구조(650)로 생성시키면, 응용프로그램(640)은 메모리(630)에 생성된 객체 트리구조(650)로부터 객체를 처리한다(예: 수정, 삭제 등등).
따라서, 웹페이지 내용이 변경될 때, 객체를 처리하는 내용이 기록함으로써, 이전 웹페이지 내용을 디스플레이하거나 다음 웹페이지 내용을 디스플레이할 수 있다.
경우에 따라, 웹페이지 내용 변경은 렌더 객체 트리구조로부터 객체를 처리함으로써 수행될 수 있다. 이때, 렌더 객체 트리구조로부터 객체를 처리하는 내용이 기록된다.
상술한 바와 같이, 애플리케이션은 소스코드를 수정하는 것이 아니라, DOM 객체 또는 렌더 객체 트리구조로부터 객체를 가공·처리함으로써, 원하는 결과물(예: 상기 도 1 (a) 내지 도 1(e))을 만들어 출력한다.
도 7(a) 내지 7(d)은 본 발명의 제1 실시 예에 따른 동적으로 변경되는 다수 웹페이지의 내용에 대한 기록 및 동적으로 변경되는 다수 웹페이지의 내용의 디스플레이를 위한 타이밍 시나리오를 도시하고 있다.
상기 도 7 (a)을 참조하면, 웹페이지의 제1 요소, 제2 요소, 제3 요소의 내용이 각각 주기적 또는 비주기적으로 변경된다. 상기 제1 요소, 상기 제2 요소, 상기 제3 요소는 이미지 또는 텍스트 속성을 갖는다. 경우에 따라서, 요소는 웹페이지 내에서 재생되는 플래시 동영상일 수도 있다.
예를 들어, 웹페이지의 제1 요소는 t1, t3, t5, ,t7, t10 동안에 각각 내용이 내용 A(700), B(701), C(702), D(703), E(704)로 변경되고, 웹페이지의 제2 요소는 t2, t6, t9 동안에 각각 내용이 내용 1(710), 2(712), 3(714)으로 변경되고, 웹페이지의 제3 요소는 t4, t8 동안에 각각 내용이 내용 a(720), b(722)로 변경된다.
한편, 웹페이지의 요소가 변경될 때마다, 웹페이지 내 요소를 화면에 그리기 위한 DOM 객체 또는 렌더 객체의 삽입/삭제/위치수정/내용변경/스타일 변경등을 기록한다. 즉, 웹페이지 내에서 내용 A에서 내용 B로 변경될 때, 메모리 내에 로딩된 DOM 또는 렌더 객체 트리에서 객체의 삽입/삭제/위치수정/내용변경/스타일 변경 등이 이루어지므로, DOM 또는 렌더 트리구조에서 객체처리 내용이 기록된다.
따라서, t1, t2, t3, t4, t5, t6, t7, t8, t9에 각각 내용 A, 1, B, a, C, 2, D, b, 3, E이 웹페이지 내에서 변경될 때, 그와 관련된 DOM 또는 렌더 트리구조에서 객체처리 내용이 각각 기록된다.
상기 도 7(b)을 참조하면, 상기 도 7(a)에서처럼 웹페이지의 내용 변경에 따른 DOM 또는 렌더 트리구조에서의 객체처리 내용 등이 모두 기록된 후에, 사용자는 웹브라우저의 툴바에 있는 제어 버튼(도 3(a) 또는 도 3(c)) 또는 도 3(b) 또는 도 3(d)의 선택메뉴를 이용하여, 웹페이지 내용이 동적으로 변경되는 것을 정지시키거나 이전 내용으로 이동하거나 앞 내용으로 이동하는 것이 가능하다.
예를 들어, 내용 E(704)로 변경된 후 웹페이지의 내용 변경을 일시정지하고, 도 3(c)에서처럼, 웹페이지 이전 내용 및 다음 내용으로 이동시킬 수 있는 제어 버튼(335, 340)이 웹브라우저의 툴바에 생성되면, 사용자는 이전 내용으로 이동시키기 위한 제어 버튼(335)을 터치하면, 내용 3(714)을 그리기 위한 DOM 객체 또는 렌더 객체에 대한 기록된 정보를 참조하여, 내용 3(714)을 포함하는 웹페이지를 화면에 디스플레이한다. 다시 말해, 내용 3(714)을 포함하는 웹페이지를 디스플레이하기 위한 DOM 또는 렌더 트리구조에서의 객체처리를 수행한다.
경우에 따라, 웹페이지 내 다수 요소들이 변경에 대한 기록은 각각 독립적으로 수행되어, 도 7(c)처럼 이전 내용으로 이동시키기 위한 제어 버튼(335)에 독립적으로 내용들이 디스플레이된다.
예를 들어, 도 7(c)을 참조하면, 내용 E, 3, b로 변경된 웹페이지에서 웹페이지 내용 변경을 일시정지하고 이전 내용으로 이동시키기 위한 제어 버튼(335)이 터치 될 시, 기록된 DOM 또는 렌더 트리구조에서의 객체처리 내용에 기반하여, 내용 D, 2, a를 포함하는 웹페이지를 디스플레이되고, 다시 이전 내용으로 이동시키기 위한 제어 버튼(335)이 터치 되면, 내용 C, 1, b를 포함하는 웹페이지가 디스플레이된다. 즉, 웹페이지의 제1 요소는 A(700), B(701), C(702), D(703), E(704)가 순환되면서 디스플레이되고, 웹페이지의 제2 요소는 내용 1(710), 2(712), 3(714)이 순환되면서 디스플레이되고, 웹페이지의 제3 요소는 내용 a(720), b(730)이 순환되면서 디스플레이된다.
도 7(d)은 t1, t2, t3, t4, t5에서 웹페이지의 내용 A, 1, B, a, C까지 관련된 DOM 객체 또는 렌더 객체의 삽입/삭제/위치수정/내용변경/스타일변경 등이 기록되고 이때 웹페이지의 내용 변경이 일시정지된 후, 이전 내용으로 이동시키기 위한 제어 버튼(335)이 터치 될 때의 예를 나타내고 있다.
예를 들어, 일시정지 버튼이 터치 될 때, 내용 D, 2, a를 포함하는 웹페이지가 디스플레이되고, 이후 이전 내용으로 이동시키기 위한 제어 버튼(335)이 터치 될 때 내용 C, 1, a를 포함하는 웹페이지가 디스플레이되고, 다시 이전 내용으로 이동시키기 위한 제어 버튼(335)이 터치 될 때 내용 B, 2, a를 포함하는 웹페이지가 디스플레이되고, 또 다시 이전 내용으로 이동시키기 위한 제어 버튼(335)이 터치 될 때 내용 A, 1, a를 포함하는 웹페이지가 디스플레이된다.
도 8(a) 내지 (b)은 본 발명의 제2 실시 예에 따른 동적으로 변경되는 다수 웹페이지의 내용에 대한 기록 및 동적으로 변경되는 다수 웹페이지의 내용의 디스플레이를 위한 타이밍 시나리오를 도시하고 있다.
상기 도 8(a)을 참조하면, 웹페이지의 제1 요소, 제2 요소, 제3 요소의 내용이 각각 주기적 또는 비주기적으로 동적으로 변경된다. 상기 제1 요소, 상기 제2 요소, 상기 제3 요소는 이미지 또는 텍스트 속성을 갖는다. 경우에 따라서, 요소는 웹페이지 내에서 재생되는 플래시 동영상일 수도 있다.
예를 들어, 웹페이지의 제1 요소는 내용이 내용 A(800), B(801), C(802), D(803), E(804)로 변경되고, 웹페이지의 제2 요소는 내용이 내용 1(810), 2(812), 3(814)으로 변경되고, 웹페이지의 제3 요소는 내용이 내용 a(820), b(822)로 변경된다.
한편, 웹페이지의 요소 변경 시점과 상관없이, 주기적인 시점에 즉, t1, t2, t3 동안에 현재 디스플레이되는 웹페이지의 변경 요소들을 화면에 그리기 위한 DOM 객체 또는 렌더 객체에 대한 정보를 기록한다. 즉, t1 시점(830)에, 웹페이지 내에 내용 B, 1, a를 디스플레이기 하기 위한 DOM 객체 또는 렌더 객체에 대한 정보를 기록하고, t2 시점(832)에, 웹페이지 내에 내용 D, 2, b를 디스플레이기 하기 위한 DOM 객체 또는 렌더 객체에 대한 정보를 기록하고, t3 시점(834)에, 웹페이지 내에 내용 E, 3, b를 디스플레이기 하기 위한 DOM 객체 또는 렌더 객체에 대한 정보를 기록한다.
상기 도 8(a)에서처럼 주기적으로 현재 디스플레이되는 웹페이지의 변경 요소들을 화면에 그리기 위한 DOM 객체 또는 렌더 객체에 대한 정보가 기록된 후, 사용자는 웹브라우저의 툴바에 있는 제어 버튼(도 2(a) 또는 도 2(d))을 이용하여, 웹페이지의 내용이 동적으로 변경되는 것을 정지시키거나 이전 내용으로 이동하거나 앞 내용으로 이동하는 것이 가능하다.
예를 들어, 상기 도 8(b)에서처럼 t3 이후에 웹페이지의 내용 변경을 일시정지하여, 도 3(c)에서처럼, 웹페이지 이전 내용 및 다음 내용으로 이동시킬 수 있는 제어 버튼(335, 345)이 웹브라우저의 툴바에 생성되면, 이전 내용으로 이동시키기 위한 제어 버튼(335)이 터치 될 때, 내용 B+2+b을 그리기 위한 DOM 객체 또는 렌더 객체에 대한 기록된 정보를 참조하여, 내용 B+2+b을 포함하는 웹페이지를 화면에 디스플레이한다. 다시 한번 더 이전 내용으로 이동시키기 위한 제어 버튼(335)이 터치 되면, 내용 B+1+a을 그리기 위한 DOM 객체 또는 렌더 객체에 대한 기록된 정보를 참조하여, 내용 B+1+a을 포함하는 웹페이지를 화면에 디스플레이한다.
상기 도 8(a)에서처럼 기록시점이 웹페이지 변경시점과 상이함으로, 기록시점과 다음 기록시점에 사이에 변경되는 웹페이지 내용(예, 내용 A(800), 내용 C(802))에 대해서 놓칠 수 있다.
도 9(a) 내지 (b)는 본 발명의 제3 실시 예에 따른 동적으로 변경되는 다수 웹페이지의 내용에 대한 기록 및 동적으로 변경되는 다수 웹페이지의 내용의 디스플레이를 위한 타이밍 시나리오를 도시하고 있다.
상기 도 9(a)를 참조하면, 웹페이지의 제1 요소, 제2 요소, 제3 요소가 각각 주기적 또는 비주기적으로 동적으로 내용이 변경된다. 상기 제1 요소, 상기 제2 요소, 상기 제3 요소는 이미지 또는 텍스트 속성을 갖는다. 경우에 따라서, 요소는 웹페이지 내에서 재생되는 플래시 동영상일 수도 있다.
예를 들어, 웹페이지의 제1 요소는 내용이 내용 A(900), B(901), C(902), D(903), E(904)로 변경되고, 웹페이지의 제2 요소는 내용이 내용 1(910), 2(912), 3(914)으로 변경되고, 웹페이지의 제3 요소는 내용이 내용 a(920), b(922)로 변경된다.
한편, 웹페이지의 요소 변경 시점과 상관없이, 주기적인 시점에 즉, t1, t2, t3 동안에 현재 디스플레이되는 웹페이지의 변경 요소들을 화면에 그리기 위한 DOM 객체 또는 렌더 객체에 대한 정보를 기록한다. 즉, t1 시점(930)에, 웹페이지 내에 내용 B, 1, a를 디스플레이기 하기 위한 DOM 객체 또는 렌더 객체에 대한 정보를 기록하고, t2 시점(932)에, 웹페이지 내에 내용 D, 2, b를 디스플레이기 하기 위한 DOM 객체 또는 렌더 객체에 대한 정보를 기록하고, 더하여, t3 시점(934)에 중요한 내용이 변경될 때(내용 C(902)에서 D(903)으로 변경될 때), 웹페이지 내에 내용 D를 디스플레이기 하기 위한 DOM 객체 또는 렌더 객체에 대한 정보를 기록한다. 즉, 내용 C(902) 대비 내용 D(903)가 전체 변경되는 경우에 그와 관련된 DOM 객체 또는 렌더 객체에 대한 정보가 기록된다. 그리고 t4 시점(936)에, 웹페이지 내에 내용 E, 3, b를 디스플레이기 하기 위한 DOM 객체 또는 렌더 객체에 대한 정보를 기록한다.
상기 도 9(a)에서처럼 현재 디스플레이되는 웹페이지의 변경 요소들을 화면에 그리기 위한 DOM 객체 또는 렌더 객체에 대한 정보(930, 932, 936) 및 중요한 내용이 변경될 때 그와 관련된 DOM 객체 또는 렌더 객체에 대한 정보(934)가 기록된 후, 사용자는 웹브라우저의 툴바에 있는 제어 버튼(도 3(a) 또는 도 3(c))을 이용하여, 웹페이지의 내용이 동적으로 변경되는 것을 정지시키거나 이전 내용으로 이동하거나 앞 내용으로 이동하는 것이 가능하다.
예를 들어, 상기 도 9(b)에서처럼 t4 이후에 웹페이지의 내용 변경을 일시정지하여, 도 3(c)에서처럼, 웹페이지 이전 내용 및 다음 내용으로 이동시킬 수 있는 제어 버튼(335, 345)이 웹브라우저의 툴바에 생성되면, 사용자는 이전 내용으로 이동시키기 위한 제어 버튼(335)을 터치하면, 내용 D+2+b을 그리기 위한 DOM 객체 또는 렌더 객체에 대한 기록된 정보를 참조하여, 내용 D+2+b을 포함하는 웹페이지를 화면에 디스플레이한다. 다시 한번 더 이전 내용으로 이동시키기 위한 제어 버튼(335)이 터치 되면, 내용 C+2+b을 그리기 위한 DOM 객체 또는 렌더 객체에 대한 기록된 정보를 참조하여, 내용 C+2+b을 포함하는 웹페이지를 화면에 디스플레이한다. 다시 한번 더 이전 내용으로 이동시키기 위한 제어 버튼(335)이 터치 되면, 내용 B+1+a을 그리기 위한 DOM 객체 또는 렌더 객체에 대한 기록된 정보를 참조하여, 내용 B+1+a을 포함하는 웹페이지를 화면에 디스플레이한다.
도 10(a) 내지 10(c)은 본 발명의 실시 예에 따른 웹페이지의 특정 내용을 동적으로 변경하는 기법을 도시하고 있다.
상기 도 10(a)을 참조하면, 렌더 트리 구조에서 내용 1 내지 내용 6과 연관된 렌더 객체의 위치가 변경되는 예를 도시하고 있다. 렌더 트리 구조에서 랜더 객체의 위치 변경은 화면상에 출력할 내용을 선택하는 것을 의미하다.
예를 들어, 제1 시점에, 화면상에 디스플레이될 내용의 위치가 내용 2(1000)와 연관된 렌더 객체에 위치할 때, 재배치(re-layout) 및 다시 그리기(re-painting)를 통해 화면의 특정 영역에 내용 2가 디스플레이된다. 제2 시점에, 화면상에 디스플레이될 내용의 위치가 내용 3(1002)과 연관된 렌더 객체에 위치할 때,재배치 및 다시 그리기를 통해 화면의 특정 영역에 내용 3이 디스플레이된다. 제3 시점에 화면상에 디스플레이될 내용의 위치가 내용 4(1004)와 연관된 렌더 객체에 위치할 때, 재배치 및 다시 그리기를 통해 화면의 특정 영역에 내용 4가 디스플레이된다. 제4 시점에, 화면상에 디스플레이될 내용의 위치가 내용 5(1006)와 연관된 렌더 객체에 위치할 때, 재배치 및 다시 그리기를 통해 화면의 특정 영역에 내용 5가 디스플레이된다. 즉, 렌더 트리 구조 내에서 위치가 변경될 뿐, 화면상에 출력되는 내용 2 내지 내용 5의 위치는 동일하다.
상기 도 10(b)을 참조하면, 내용 1 내지 내용 4는 DOM 트리 구조 또는 렌더 트리 구조에서 내용 1 내지 내용 4과 관련된 객체들의 위치들은 동일하다. 다시 말해, DOM 트리 구조 또는 렌더 트리 구조에서 내용 1 내지 내용 4과 관련된 객체들은 서로 겹쳐져 있고, 객체의 디스플레이 속성을 변경시킴으로써 동일한 위치에서 내용 1과 내용 2를 나타낼 수 있다.
예를 들어, 내용 1(1010)과 관련된 객체에 대한 디스플레이의 속성을 "block"으로 하고, 나머지 내용 2 내지 내용 4(1012, 1014, 1016)관 관련된 객체들에 대한 디스플레이의 속성을 각각 "none"으로 설정되면, 화면상에 디스플레이될 때는 내용 1(1010)만 나타난다.
마찬가지로, 내용 2(1012)과 관련된 객체에 대한 디스플레이의 속성을 "block"으로 하고, 나머지 내용 1, 내용 3, 내용 4(1010, 1014, 1016)관 관련된 객체들에 대한 디스플레이의 속성을 각각 "none"으로 설정되면, 화면상에 디스플레이될 때는 내용 2(1012)만 나타나고, 내용 3(1014)과 관련된 객체에 대한 디스플레이의 속성을 "block"으로 하고, 나머지 내용 1, 내용 2, 내용 4(1010, 1012, 1016)관 관련된 객체들에 대한 디스플레이의 속성을 각각 "none"으로 설정되면, 화면상에 디스플레이될 때는 내용 3(1014)만 나타나고, 내용 2(1016)과 관련된 객체에 대한 디스플레이의 속성을 "block"으로 하고, 나머지 내용 1, 내용 2, 내용 3(1010, 1012, 1014)관 관련된 객체들에 대한 디스플레이의 속성을 각각 "none"으로 설정되면, 화면상에 디스플레이될 때는 내용 4(101016)만 나타난다.
도 11은 본 발명의 실시 예에 따른 웹페이지 내에 재생되는 플래시 동영상에 대한 정보를 기록하는 시나리오를 도시하고 있다.
상기 도 11을 참조하면, 플래시 동영상인 경우, 기록시점(1102)에 플래시 동영상의 이미지 또는 프레임번호를 기록된다. 예를 들어, 제1 시점에 재생되는 이미지에 해당하는 프레임 1에 대한 정보를 기록하고, 제2 시점에 재생되는 이미지에 해당하는 프레임 3에 대한 정보를 기록한다.
이후에, 웹페이지 내용 변경이 정지될 시, 재생중인 플래시 동영상은 정지되고, 이전 웹페이지 내용 이동 버튼(335) 및 다음 웹페이지 내용 이동 버튼(345)에 따라 기록된 프레임번호에 해당하는 이미지를 디스플레이할 수도 있다.
도 12는 본 발명의 실시 예에 따른 웹페이지 내에서 스크롤 이동으로 인한 화면상에서의 내용 위치 이동에 대한 정보를 기록하는 시나리오를 도시하고 있다.
상기 도 12를 참조하면, 화면(1200)상에 웹페이지의 내용(1212)이 디스플레이되고 이후 스크롤바(1202)를 위로 이동시킬 때, 화면(1200)상에 웹페이지의 내용(1210)은 아래로 이동하여 A영역(1212)에 위치한다. 다시 말해, 배치과정 중 내용(1210)과 관련된 위치는 변경되지 않지만, 스크롤을 통해 화면상에서 내용(1210)의 상대적인 위치(1212)는 변경되므로, 이때 스크롤링을 통해 화면상에서 변경되는 내용(1210)의 위치정보(1220)가 기록된다.
비록 스크롤링할 때 하나의 내용만을 예를 들었지만, 실제 스크롤링이 될 때 전체 화면에 디스플레이되는 내용들일 모두 위치가 변경되므로, 이때 화면상에 디스플레이되는 모든 내용들에 대한 상대적 위치 정보가 기록된다.
도 13은 본 발명의 제1 실시 예에 따른 웹페이지의 동적으로 변하는 객체를 제어하기 위한 흐름도를 도시하고 있다.
상기 도 13을 참조하면, 전자장치는 1300단계에서 웹브라우저를 실행하고, 1302계에서 해당 웹페이지의 주소 검색 및 웹페이지 요청을 수행한다.
이후, 전자장치는 1304단계에서 서버로부터 해당 웹페이지의 소스코드(예: HTML 또는 XML 코드)를 수신한다.
이후, 전자장치는 1306단계에서 해당 웹페이지의 소스코드를 파싱하여 DOM 트리 구조를 생성한다. 이때, DOM 트리 구조는 메모리 내에 데이터구조로 존재하게 된다.
이후, 전자장치는 1308단계에서 DOM 트리 구조와 웹페이지의 스타일 규칙과 결합하여, 렌더 트리 구조를 생성한다.
이후, 전자장치는 1310에서 렌더 트리 구조에 기반하여, 각 렌더 객체의 위치와 크기를 결정하는 배치(layout)작업을 수행하고, 1312단계에서 배치작업을 결과를 기반으로 그리기(painting) 작업을 수행한다. 이때, 화면에 상기 웹페이지의 내용들이 디스플레이된다. 이때, 동적으로 변하는 내용을 일시정지시킬 수 있는 명령버튼(330) 및 선택메뉴(351, 352)가 웹브라우저에 활성화된다. 여기서, 일시정지는 웹페이지 내의 내용 변경을 위한 재배치(re-layout) 및 다시 그리기(repaint)가 보류되는 것이다.
이후, 전자장치는 1314단계에서 화면에 디스플레이되는 웹페이지 내에 동적으로 변하는 내용들이 있을 시, 1316단계로 진행하여 웹페이지 내에 동적으로 변하는 내용에 대한 정보를 기록한다. 예를 들어, 웹페이지 내에 동적으로 변하는 내용과 관련된 DOM 트리 구조의 객체의 삽입/삭제/위치수정/내용변경/스타일변경 등등을 기록한다(도 10(a) 내지 도 10(b) 참조). 또는, 웹페이지 내에 동적으로 변하는 내용과 관련된 렌더 트리 구조의 객체의 삽입/삭제/위치수정/내용변경/스타일변경 등등을 기록한다. 구현에 따라, 자바스크립트를 통해 내용이 변경되는 경우, 변경시점에 실행될 자바스크립트 내용을 기록한다((도 10(c)).
다른 구현에 따라, 웹페이지 내에 플래시 동영상이 재생되는 경우, 주기적으로 현재 디스플레이되는 플래시 동영상의 프레임번호를 기록하거나(도 11 참조), 스크롤링을 통해 웹페이지의 내용들의 위치가 변경될 때, 화면상에서 변경되는 내용들의 위치들을 기록한다(도 12 참조).
만약, 1314에서 화면에 디스플레이되는 웹페이지 내에 동적으로 변하는 내용들이 없을 시, 해당모드로 진입하여 현재 디스플레이되는 웹페이지의 상태를 유지한다.
이후, 전자장치는 1318단계에서 동적으로 변하는 웹페이지 내용에 따라 DOM 트리 또는 렌더 트리의 구성요소에 대한 속성을 변경한다. 즉, 트리형태의 구조에서 객체의 삽입/삭제/위치수정/내용변경/스타일변경을 적용한다.
이후, 전자장치는 1320단계에서 변경된 DOM 트리 구조 또는 렌더 트리 구조에 기반하여, 화면상에 디스플레이될 웹페이지의 객체들의 위치와 크기를 결정하는 재배치를 수행하고, 1322단계에서 재배치된 결과에 따라 화면에 변경된 내용을 포함하는 웹페이지를 디스플레이한다. 즉, 웹페이지 내 내용들이 변경되는 경우, 메모리에 로딩된 상기 웹페이지의 DOM 트리 또는 렌더 트리의 객체들의 삽입/삭제/위치변경/속성변경 등을 통해 웹페이지 내용 변경이 이루어진다.
이후, 전자장치는 1324단계에서 동적으로 변하는 내용을 제어하는 이벤트가 발생할 시, 1326단계로 진행하여 이벤트에 따라, 동적으로 변하는 웹페이지 내용의 디스플레이를 정지/재생하거나, 이전 내용으로 이동하기 또는 앞으로 이동하기(도 2 참조)를 수행한다.
이후, 본 발명의 절차를 종료한다.
도 14는 본 발명의 제2 실시 예에 따른 웹페이지의 동적으로 변하는 객체를 제어하기 위한 흐름도를 도시하고 있다.
상기 도 14를 참조하면, 전자장치는 1400단계에서 웹브라우저를 실행하여 웹페이지를 로딩한다. 웹페이지 로딩 단계는 도 13의 1300단계 내지 1312단계를 의미한다. 이때, 동적으로 변하는 내용을 일시정지시킬 수 있는 명령버튼(330) 및 선택메뉴(351, 352)가 웹브라우저에 활성화된다. 여기서, 일시정지는 웹페이지 내의 내용 변경을 위한 재배치(re-layout) 및 다시 그리기(repaint)가 보류되는 것이다.
이후, 전자장치는 1402단계에서 로딩된 웹페이지 내 관심영역을 선택한다. 상기 관심영역은 웹페이지 내 다수의 객체의 내용들이 변하는 경우, 동적으로 변하는 다수의 객체 내용 중 일부를 선택하여 변하는 내용을 추적하기 위해 정의된다.
이후, 전자장치는 1404단계에서 웹페이지 내 관심영역에 동적으로 변하는 내용이 있을 시, 1406단계로 진행하여 웹페이지 내에 동적으로 변하는 내용에 대한 정보를 기록한다. 이때, "관심영역" 밖에서의 내용 변경은 기록되지 않는다. 예를 들어, 웹페이지 내 관심영역에 동적으로 변하는 내용과 관련된 DOM 트리 구조의 객체의 삽입/삭제/위치수정/내용변경/스타일변경 등등을 기록한다(도 10(a) 내지 도 10(b) 참조). 또는, 웹페이지 내에 동적으로 변하는 내용과 관련된 렌더 트리 구조의 객체의 삽입/삭제/위치수정/내용변경/스타일변경 등등을 기록한다. 구현에 따라, 자바스크립트를 통해 내용이 변경되는 경우, 변경시점에 실행될 자바스크립트 내용을 기록한다((도 10(c)).
다른 구현에 따라, 웹페이지 내에 플래시 동영상이 재생되는 경우, 주기적으로 현재 디스플레이되는 플래시 동영상의 프레임번호를 기록하거나(도 11 참조), 스크롤링을 통해 웹페이지의 내용들의 위치가 변경될 때, 화면상에서 변경되는 내용들의 위치들을 기록한다(도 12 참조).
만약, 1404에서 웹페이지 내 관심영역에 동적으로 변하는 내용들이 없을 시, 해당모드로 진입하여 현재 디스플레이되는 웹페이지의 상태를 유지한다.
도시하지 않았지만, 전자장치는 동적으로 변하는 웹페이지 내용에 따라 DOM 트리 또는 렌더 트리의 구성요소에 대한 속성을 변경하고, 즉, 트리형태의 구조에서 객체의 삽입/삭제/위치수정/내용변경/스타일변경을 적용하고, 변경된 DOM 트리 구조 또는 렌더 트리 구조에 기반하여, 화면상에 디스플레이될 웹페이지의 객체들의 위치와 크기를 결정하는 재배치를 수행하고, 재배치된 결과에 따라 화면에 변경된 내용을 포함하는 웹페이지를 디스플레이한다. 즉, 웹페이지 내 내용들이 변경되는 경우, 메모리에 로딩된 상기 웹페이지의 DOM 트리 또는 렌더 트리의 객체들의 삽입/삭제/위치변경/속성변경 등을 통해 웹페이지 내용 변경이 이루어진다.
이후, 전자장치는 1408단계에서 동적으로 변하는 내용을 제어하는 이벤트가 발생하지 않을 시, 1406단계로 되돌아간다.
전자장치는 1408단계에서 동적으로 변하는 내용을 제어하는 이벤트가 발생할 시, 즉, 동적으로 내용의 디스플레이를 일시정지(330)/재생(340)시키는 명령이 실행될 때, 1412단계로 진행하여 동적으로 변하는 내용을 디스플레이하거나 일시정지시킨다. 다시 말해, 변경된 DOM 트리 및 렌더 트리 구조하에 재배치 및 다시 그리기 작업이 정지되거나 재배치 및 다시 그리기 작업이 수행된다.
전자장치는 1408단계에서 동적으로 변하는 내용을 제어하는 이벤트가 발생할 시, 즉, 이전 내용으로 이동하기 또는 앞으로 이동하기 명령(335, 345)이 실행될 때, 1410단계로 진행하여, 기록된 정보를 기반으로, 이전 내용으로 이동하기 또는 앞으로 이동하기 명령에 대응하는 DOM 트리 구조 또는 렌더 트리 구조로 변경한다.
이후, 전자장치는 1414단계에서 변경된 DOM 트리 구조 또는 렌더 트리 구조에 기반하여, 화면상에 디스플레이될 웹페이지의 객체들의 위치와 크기를 결정하는 재배치를 수행하고, 1416단계에서 재배치된 결과에 따라 화면에 변경된 내용을 포함하는 웹페이지를 디스플레이한다. 즉, 웹페이지 내 내용들이 변경되는 경우, 메모리에 로딩된 상기 웹페이지의 DOM 트리 또는 렌더 트리의 객체들의 삽입/삭제/위치변경/속성변경 등을 통해 웹페이지 내용 변경이 이루어진다.
이후, 본 발명의 절차를 종료한다.
도 15는 본 발명의 실시 예에 따른 전자장치의 블록도를 도시하고 있다.
전자장치는, 휴대용 전자 장치(portable electronic device)일 수 있으며, 휴대용 단말기(portable terminal), 이동 단말기(mobile terminal), 이동 패드(mobile pad), 미디어 플레이어(media player), 태블릿 컴퓨터(tablet computer), 핸드헬드 컴퓨터(handheld computer) 또는 PDA(Personal Digital Assistant)와 같은 장치일 수 있다. 또한, 이러한 장치들 중 두 가지 이상의 기능을 결합한 장치를 포함하는 임의의 휴대용 전자 장치일 수도 있다.
상기 도 15를 참조하면, 전자장치는 제어기(1500), 스피커/마이크로폰(1510), 카메라(1520), GPS 수신기(1530), RF 처리기(1540), 센서모듈(1550), 터치스크린(1560), 터치스크린 제어기(1565), 확장 메모리(1570)를 포함하여 구성된다.
제어기(1500)는, 인터페이스(1501), 하나 이상의 프로세서(1502, 1503) 그리고 내부 메모리(1504)를 포함할 수 있다. 경우에 따라서는, 제어기(1500) 전체를 프로세서로 칭하기도 한다. 인터페이스(1501), 애플리케이션 프로세서(1502), 통신 프로세서(1503), 내부 메모리(1504)는 별개의 구성요소일 수 있거나 하나 이상의 집적화된 회로에 집적화될 수 있다.
애플리케이션 프로세서(1502)는 여러 가지의 소프트웨어 프로그램을 실행하여 전자장치를 위한 여러 기능을 수행하고 통신 프로세서(1503)는 음성 통신 및 데이터 통신을 위한 처리 및 제어를 수행한다. 또한, 이러한 통상적인 기능에 더하여, 프로세서(1502, 1503)는 확장 메모리(1570) 혹은 내부 메모리(1504)에 저장되어 있는 특정한 소프트웨어 모듈(명령어 세트)을 실행하여 그 모듈에 대응하는 특정한 여러 가지의 기능을 수행하는 역할도 한다. 즉, 프로세서(1502, 1503)는 확장 메모리(1570) 혹은 내부 메모리(1504)에 저장된 소프트웨어 모듈들과 연동하여 본 발명의 웹페이지 내의 특정 내용의 디스플레이를 제어하기 위한 방법을 수행한다.
예를 들어, 애플리케이션 프로세서(1502)가, 웹브라우저를 실행하고, 해당 웹페이지의 주소 검색 및 웹페이지 요청을 수행하고, 서버로부터 해당 웹페이지의 소스코드(예: HTML 또는 XML 코드)를 수신하고, 해당 웹페이지의 소스코드를 파싱하여 메모리(1504 또는 1570) 내에 DOM 트리 구조를 생성하고, DOM 트리 구조와 웹페이지의 스타일 규칙과 결합하여, 렌더 트리 구조를 생성하고, 렌더 트리 구조에 기반하여, 각 렌더 객체의 위치와 크기를 결정하는 배치(layout)작업을 수행하고, 배치작업을 결과를 기반으로 그리기(painting) 작업을 수행하고, 화면에 디스플레이되는 웹페이지 내에 동적으로 변하는 내용들이 있을 시, 웹페이지 내에 동적으로 변하는 내용에 대한 정보를 기록하고, 화면에 디스플레이되는 웹페이지 내에 동적으로 변하는 내용들이 없을 시, 해당모드로 진입하여 현재 디스플레이되는 웹페이지의 상태를 유지하고, 동적으로 변하는 웹페이지 내용에 따라 DOM 트리 또는 렌더 트리의 구성요소에 대한 속성을 변경하고, 변경된 DOM 트리 구조 또는 렌더 트리 구조에 기반하여, 화면상에 디스플레이될 웹페이지의 객체들의 위치와 크기를 결정하는 재배치를 수행하고, 재배치된 결과에 따라 화면에 변경된 내용을 포함하는 웹페이지를 디스플레이하고, 동적으로 변하는 내용을 제어하는 이벤트가 발생할 시, 이벤트에 따라, 동적으로 변하는 웹페이지 내용의 디스플레이를 정지/재생하거나, 이전 내용으로 이동하기 또는 앞으로 이동하기(도 2 참조)를 수행한다.
또 다른 실시 예에 따라, 애플리케이션 프로세서(1502)가, 웹브라우저를 실행하여 웹페이지를 로딩하고, 로딩된 웹페이지 내 관심영역을 선택하고, 여기서, 상기 관심영역은 웹페이지 내 다수의 객체의 내용들이 변하는 경우, 동적으로 변하는 다수의 객체 내용 중 일부를 선택하여 변하는 내용을 추적하기 위해 정의되며, 웹페이지 내 관심영역에 동적으로 변하는 내용이 있을 시, 웹페이지 내에 동적으로 변하는 내용에 대한 정보를 기록하되, 이때, "관심영역" 밖에서의 내용 변경은 기록되지 않으며, 웹페이지 내 관심영역에 동적으로 변하는 내용들이 없을 시, 해당모드로 진입하여 현재 디스플레이되는 웹페이지의 상태를 유지하고, 동적으로 변하는 내용을 제어하는 이벤트가 발생할 시, 즉, 동적으로 내용의 디스플레이를 일시정지(330)/재생(340)시키는 명령이 실행될 때, 동적으로 변하는 내용을 디스플레이하거나 일시정지시키고, 이전 내용으로 이동하기 또는 앞으로 이동하기 명령(335, 345)이 실행될 때, 기록된 정보를 기반으로, 이전 내용으로 이동하기 또는 앞으로 이동하기 명령에 대응하는 DOM 트리 구조 또는 렌더 트리 구조로 변경하고, 변경된 DOM 트리 구조 또는 렌더 트리 구조에 기반하여, 화면상에 디스플레이될 웹페이지의 객체들의 위치와 크기를 결정하는 재배치를 수행하고, 재배치된 결과에 따라 화면에 변경된 내용을 포함하는 웹페이지를 디스플레이한다. 즉, 웹페이지 내 내용들이 변경되는 경우, 메모리에 로딩된 상기 웹페이지의 DOM 트리 또는 렌더 트리의 객체들의 삽입/삭제/위치변경/속성변경 등을 통해 웹페이지 내용 변경이 이루어진다.
한편, 다른 프로세서(도시하지 않음)는 하나 이상의 데이터 프로세서, 이미지 프로세서, 또는 코덱을 포함할 수 있다. 데이터 프로세서, 이미지 프로세서 또는 코덱은 별도로 구성할 수도 있다. 또한, 서로 다른 기능을 수행하는 여러 개의 프로세서로 구성될 수도 있다. 인터페이스(1501)는 전자장치의 터치 스크린 제어기(1565) 및 확장 메모리(1570)에 연결시킨다.
센서모듈(1550)은 인터페이스(1501)에 결합되어 여러 가지 기능을 가능하게 할 수 있다. 예를 들어, 움직임 센서 및 광센서가 인터페이스(1501)에 결합되어 각각 전자 장치의 움직임 감지 및 외부로부터의 빛 감지를 가능하게 할 수 있다. 이외에도, 위치측정 시스템, 온도센서 또는 생체 센서 등과 같은 기타 센서들이 인터페이스(1550)에 연결되어 관련 기능들을 수행할 수 있다.
카메라(1520)는 인터페이스(1501)를 통해 센서모듈(1550)과 결합하여, 사진 및 비디오 클립 레코딩과 같은 카메라 기능을 수행할 수 있다.
RF 처리기(1540)는 통신 기능이 수행된다. 예를 들어, 통신 프로세서(1503)의 제어하에 RF 신호를 기저대역 신호로 변환하여 통신 프로세서(1503)로 제공하거나 통신 프로세서(1503)로부터의 기저대역 신호를 RF 신호로 변환하여 송신한다. 여기서, 통신 프로세서(1503)는 다양한 통신방식에 기저대역신호를 처리한다. 예를 들어, 통신방식은, 이들에 한정하지는 않지만, GSM(Global System for Mobile Communication) 통신방식, EDGE(Enhanced Data GSM Environment) 통신방식, CDMA(Code Division Multiple Access) 통신방식, W-CDMA(W-Code Division Multiple Access) 통신방식, LTE(Long Term Evolution) 통신방식, OFDMA(Orthogonal Frequency Division Multiple Access) 통신방식, Wi-Fi(Wireless Fidelity) 통신방식, WiMax 통신방식 또는/및 Bluetooth 통신방식을 포함할 수 있다.
스피커/마이크로폰(1510)은 음성 인식, 음성 복제, 디지털 레코딩(recording) 및 전화 기능과 같은 오디오 스트림의 입력과 출력을 담당할 수 있다. 즉, 스피커/마이크로폰(1510)은 음성신호를 전기신호로 변환하거나 전기신호를 음성신호로 변환한다. 도시하지 않았지만, 탈부착 가능한(attachable and detachable) 이어폰(ear phone), 헤드폰(head phone) 또는 헤드셋(head set)이 외부포트를 통해 전자장치에 연결될 수 있다.
터치스크린 제어기(1565)는 터치스크린(1560)에 결합될 수 있다. 제스처 스크린(1560) 및 터치 스크린 제어기(1565)는, 이하에 한정되지는 않지만, 터치스크린(1560)과의 하나 이상의 접촉점을 결정하기 위한 용량성, 저항성, 적외선 및 표면 음향파 기술들뿐만 아니라 기타 근접 센서 배열 또는 기타 요소들을 포함하는 임의의 멀티 터치 감지 기술을 이용하여 접촉 및 움직임 또는 이들의 중단을 검출할 수 있다.
터치스크린(1560)은 전자장치와 사용자 사이에 입력/출력 인터페이스를 제공한다. 즉, 터치스크린(1560)은 사용자의 터치입력을 전자 장치에 전달한다. 또한 전자 장치로부터의 출력을 사용자에게 보여주는 매개체이다. 즉, 터치스크린은 사용자에게 시각적인 출력을 보여준다. 이러한 시각적 출력(visual output)은 텍스트(text), 그래픽(graphic), 비디오(video)와 이들의 조합의 형태로 나타난다.
터치스크린(1560)은 여러 가지 디스플레이가 사용될 수 있다. 예를 들면, 이에 한정하지는 않지만, LCD(liquid crystal display), LED(Light Emitting Diode), LPD(light emitting polymer display), OLED(Organic Light Emitting Diode), AMOLED(Active Matrix Organic Light Emitting Diode) 또는 FLED(Flexible LED)를 사용할 수 있다.
GPS 수신기(1530)는 인공위성으로부터 받은 신호를 위치, 속도, 시간 등의 정보로 변환한다. 예를 들어, 위성과 GPS 수신기간 거리는 빛의 속도와 신호도달 시간을 곱하면 계산되며, 3개 위성의 정확한 위치와 거리를 구하여 공지된 삼각측량의 원리로 전자장치의 위치가 측정된다.
확장 메모리(1570) 혹은 내부 메모리(1504)는 하나 이상의 자기 디스크 저장 장치와 같은 고속 랜덤 액세스 메모리 및/또는 비휘발성 메모리, 하나 이상의 광 저장 장치 및/또는 플래시 메모리(예컨대, NAND, NOR)를 포함할 수 있다.
확장 메모리(1570) 혹은 내부 메모리(1504)는 소프트웨어를 저장한다. 소프트웨어 구성요소는 운영 체제(operating system) 소프트웨어 모듈, 통신 소프트웨어 모듈, 그래픽 소프트웨어 모듈, 사용자 인터페이스 소프트웨어 모듈 및 MPEG 모듈, 카메라 소프트웨어 모듈, 하나 이상의 애플리케이션 소프트웨어 모듈 등을 포함한다. 또한, 소프트웨어 구성요소인 모듈은 명령어들의 집합으로 표현할 수 있으므로, 모듈을 명령어 세트(instruction set)라고 표현하기도 한다. 모듈은 또한 프로그램으로 표현하기도 한다.
운영 체제 소프트웨어는 일반적인 시스템 동작(system operation)을 제어하는 여러 가지의 소프트웨어 구성요소를 포함한다. 이러한 일반적인 시스템 작동의 제어는, 예를 들면, 메모리 관리 및 제어, 저장 하드웨어(장치) 제어 및 관리, 전력 제어 및 관리 등을 의미한다. 이러한 운영 체제 소프트웨어는 여러 가지의 하드웨어(장치)와 소프트웨어 구성요소(모듈) 사이의 통신을 원활하게 하는 기능도 수행한다.
통신 소프트웨어 모듈은, RF 처리기(1540)를 통해 컴퓨터, 서버 및/또는 휴대용 단말기 등 다른 전자 장치와 통신을 가능하게 할 수 있다. 그리고, 통신 소프트웨어 모듈은, 해당 통신방식에 해당하는 프로토콜 구조로 구성된다.
그래픽 소프트웨어 모듈은 터치스크린(1560) 상에 그래픽을 제공하고 표시하기 위한 여러 가지 소프트웨어 구성요소를 포함한다. 그래픽(graphics)이란 용어는 텍스트(text), 웹 페이지(web page), 아이콘(icon), 디지털 이미지(digital image), 비디오(video), 애니메이션(animation) 등을 포함하는 의미로 사용된다.
사용자 인터페이스 소프트웨어 모듈은 사용자 인터페이스에 관련한 여러 가지 소프트웨어 구성요소를 포함한다. 사용자 인터페이스의 상태가 어떻게 변경되는지 또는 사용자 인터페이스 상태의 변경이 어떤 조건에서 이루어지는지 등에 대한 내용을 포함한다.
카메라 소프트웨어 모듈은 카메라 관련 프로세스 및 기능들을 가능하게 하는 카메라 관련 소프트웨어 구성요소를 포함한다. 애플리케이션 모듈은 렌더링 엔진을 포함하는 웹브라우저(browser), 이메일(email), 즉석 메시지(instant message), 워드 프로세싱(word processing), 키보드 에뮬레이션(keyboard emulation), 어드레스 북(address book), 접촉 리스트(touch list), 위젯(widget), 디지털 저작권 관리(DRM, Digital Right Management), 음성 인식(voice recognition), 음성 복제, 위치 결정 기능(position determining function), 위치기반 서비스(location based service) 등을 포함한다. 메모리(1570, 1504)는 위에서 기술한 모듈 이외에 추가적인 모듈(명령어들)을 포함할 수 있다. 또는, 필요에 따라, 일부의 모듈(명령어들)을 사용하지 않을 수 있다. 본 발명에 더하여, 상기 웹브라우저는 웹페이지 내 동적으로 변하는 객체들의 디스플레이를 제어하는 실행버튼 및 선택메뉴를 포함하고 있다(도 3(a) 내지 3(d)).
본 발명에 관련하여, 애플리케이션 모듈은 웹페이지 내 특정 내용의 디스플레이를 제어하기 위한 명령어들(하기 도 13 내지 도 14 참조)을 포함한다.
예를 들어, 애플리케이션 모듈은, 웹브라우저를 실행하고, 해당 웹페이지의 주소 검색 및 웹페이지 요청을 수행하고, 서버로부터 해당 웹페이지의 소스코드(예: HTML 또는 XML 코드)를 수신하고, 해당 웹페이지의 소스코드를 파싱하여 메모리(1504 또는 1570) 내에 DOM 트리 구조를 생성하고, DOM 트리 구조와 웹페이지의 스타일 규칙과 결합하여, 렌더 트리 구조를 생성하고, 렌더 트리 구조에 기반하여, 각 렌더 객체의 위치와 크기를 결정하는 배치(layout)작업을 수행하고, 배치작업을 결과를 기반으로 그리기(painting) 작업을 수행하고, 화면에 디스플레이되는 웹페이지 내에 동적으로 변하는 내용들이 있을 시, 웹페이지 내에 동적으로 변하는 내용에 대한 정보를 기록하고, 화면에 디스플레이되는 웹페이지 내에 동적으로 변하는 내용들이 없을 시, 해당모드로 진입하여 현재 디스플레이되는 웹페이지의 상태를 유지하고, 동적으로 변하는 웹페이지 내용에 따라 DOM 트리 또는 렌더 트리의 구성요소에 대한 속성을 변경하고, 변경된 DOM 트리 구조 또는 렌더 트리 구조에 기반하여, 화면상에 디스플레이될 웹페이지의 객체들의 위치와 크기를 결정하는 재배치를 수행하고, 재배치된 결과에 따라 화면에 변경된 내용을 포함하는 웹페이지를 디스플레이하고, 동적으로 변하는 내용을 제어하는 이벤트가 발생할 시, 이벤트에 따라, 동적으로 변하는 웹페이지 내용의 디스플레이를 정지/재생하거나, 이전 내용으로 이동하기 또는 앞으로 이동하기(도 2 참조)를 수행한다.
또 다른 실시 예에 따라, 애플리케이션 모듈은, 웹브라우저를 실행하여 웹페이지를 로딩하고, 로딩된 웹페이지 내 관심영역을 선택하고, 여기서, 상기 관심영역은 웹페이지 내 다수의 객체의 내용들이 변하는 경우, 동적으로 변하는 다수의 객체 내용 중 일부를 선택하여 변하는 내용을 추적하기 위해 정의되며, 웹페이지 내 관심영역에 동적으로 변하는 내용이 있을 시, 웹페이지 내에 동적으로 변하는 내용에 대한 정보를 기록하되, 이때, "관심영역" 밖에서의 내용 변경은 기록되지 않으며, 웹페이지 내 관심영역에 동적으로 변하는 내용들이 없을 시, 해당모드로 진입하여 현재 디스플레이되는 웹페이지의 상태를 유지하고, 동적으로 변하는 내용을 제어하는 이벤트가 발생할 시, 즉, 동적으로 내용의 디스플레이를 일시정지(330)/재생(340)시키는 명령이 실행될 때, 동적으로 변하는 내용을 디스플레이하거나 일시정지시키고, 이전 내용으로 이동하기 또는 앞으로 이동하기 명령(335, 345)이 실행될 때, 기록된 정보를 기반으로, 이전 내용으로 이동하기 또는 앞으로 이동하기 명령에 대응하는 DOM 트리 구조 또는 렌더 트리 구조로 변경하고, 변경된 DOM 트리 구조 또는 렌더 트리 구조에 기반하여, 화면상에 디스플레이될 웹페이지의 객체들의 위치와 크기를 결정하는 재배치를 수행하고, 재배치된 결과에 따라 화면에 변경된 내용을 포함하는 웹페이지를 디스플레이한다. 즉, 웹페이지 내 내용들이 변경되는 경우, 메모리에 로딩된 상기 웹페이지의 DOM 트리 또는 렌더 트리의 객체들의 삽입/삭제/위치변경/속성변경 등을 통해 웹페이지 내용 변경이 이루어진다.
또한, 위에서 언급한, 그리고 이하에서 언급할, 본 발명에 따른 전자장치의 다양한 기능들은 하나 이상의 프로세싱(processing) 및/또는 애플리케이션 특정 집적 회로(ASIC, Application Specific Integrated circuit)를 포함하는 하드웨어 및/또는 소프트웨어 및/또는 이들의 결합으로 실행될 수 있다.
도 16은 본 발명의 제3 실시 예에 따른 웹페이지 내에 동적 콘텐츠의 디스플레이를 제어하기 위한 흐름도를 도시하고 있다.
상기 도 16을 참조하면, 전자장치는 1600단계에서 웹페이지 내에 동적 콘텐츠가 포함되어 있을 때, 설정된 시점에서 상기 웹페이지에 대응하는 데이터 구조의 내용을 저장한다. 여기서, 상기 설정된 시점은 일정 주기 또는 상기 동적 콘텐트가 변화는 시점이다. 즉, 전자장치는 상기 동적 콘텐트가 변화는 시점마다 상기 웹페이지에 대응하는 데이터 구조의 변경 내용을 저장할 수 있다. 다른 실시 예에서, 전자장치는 상기 동적 콘텐트가 변화는 시점과 상관없이 주기적으로 상기 웹페이지에 대응하는 데이터 구조의 변경 내용을 저장할 수도 있다.
한편, 상기 웹페이지에 대응하는 데이터 구조의 내용을 저장할 시, 전자장치는 상기 데이터 구조 내에 객체의 삽입, 삭제, 위치변경, 속성변경 또는 스타일변경을 검출하여, 상기 검출 결과에 대응하는 변경 내용을 기록한다. 또는, 상기 웹페이지에 대응하는 데이터 구조의 내용을 저장할 시, 전자장치는 메모리에 로딩되어 있는 상기 데이터 구조의 전체 내용을 기록할 수도 있다.
이후, 전자장치는 1602단계에서 특정 시점의 상기 웹페이지에 대응하는 데이터 구조의 내용을 독출 하는 이벤트가 발생하는지를 확인하고, 특정 시점의 상기 웹페이지에 대응하는 데이터 구조의 내용을 독출 하는 이벤트가 발생할 시, 1604단계로 진행하고 이벤트가 발생하기 않을 시 1600단계로 되돌아간다.
전자장치는 1604단계에서, 상기 저장된 웹페이지에 대응하는 데이터 구조의 내용을 독출하여 디스플레이한다. 즉, 전자장치는 상기 저장된 웹페이지에 대응하는 데이터 구조의 내용을 기반으로, 재배치(re-layouting) 및 다시 그리기(repainting)를 수행할 수 있다.
한편, 도시하지 않았지만, 상기 웹페이지 내에 동적 콘텐츠의 디스플레이를 일시 정지시키는 제어 이벤트가 발생할 때, 전자장치는 상기 웹페이지 내에 동적 콘텐츠의 변경내용에 대한 디스플레이를 정지시킨다. 다시 말해, 전자장치는 상기 웹페이지 내에 동적 콘텐츠를 디스플레이 하기 위한 재배치(re-layouting) 및 다시 그리기(repainting)를 정지시킨다. 상기 웹페이지 내에 동적 콘텐츠의 디스플레이를 일시 정지시키는 제어 이벤트 발생 이후에 전자장치는 상기 웹페이지 내에 동적 콘텐츠의 디스플레이의 일시 정지를 해지시키고 현재 시점의 상기 웹페이지에 대응하는 데이터 구조의 내용을 독출하여 디스플레이하는 할 수도 있다. 다시 말해, 상기 웹페이지 내에 동적 콘텐츠의 디스플레이의 일시 정지를 해지시킬 시, 전자장치는 상기 웹페이지 내에 동적 콘텐츠를 디스플레이 하기 위한 재배치(re-layouting) 및 다시 그리기(repainting)를 수행한다.
한편 본 발명의 상세한 설명에서는 구체적인 실시 예에 관해 설명하였으나, 본 발명의 범위에서 벗어나지 않는 한도 내에서 여러 가지 변형이 가능함은 물론이다. 그러므로 본 발명의 범위는 설명된 실시 예에 국한되어 정해져서는 아니 되며 후술하는 특허청구의 범위뿐만 아니라 이 특허청구의 범위와 균등한 것들에 의해 정해져야 한다.
제어기: 1500
인터페이스: 1501
애플리케이션 프로세서: 1502
통신 프로세서: 1503
RF 처리기: 1540
확장 메모리: 1570

Claims (40)

  1. 전자장치에서 웹페이지 내에 동적 콘텐츠의 디스플레이를 제어하는 방법에 있어서,
    웹페이지 내에 동적 콘텐츠가 포함되어 있을 때, 설정된 시점에서 상기 웹페이지에 대응하는 데이터 구조의 내용을 저장하는 과정과,
    특정 시점의 상기 웹페이지에 대응하는 데이터 구조의 내용을 독출 하는 이벤트가 발생할 시, 상기 저장된 웹페이지에 대응하는 데이터 구조의 내용을 독출하여 디스플레이하는 과정을 포함하는 방법.
  2. 제1항에 있어서,
    상기 설정된 시점은 일정 주기 또는 상기 동적 콘텐트가 변화는 시점인 것을 특징으로 하는 방법.
  3. 제1항에 있어서,
    상기 데이터 구조의 내용은 변경 내용인 것을 특징으로 하는 방법.
  4. 제1항에 있어서,
    상기 웹페이지에 대응하는 데이터 구조의 내용을 저장하는 과정은,
    상기 데이터 구조 내에 객체의 삽입, 삭제, 위치변경, 속성변경 또는 스타일변경을 검출하는 과정과,
    상기 검출 결과에 대응하는 변경 내용을 기록하는 과정을 포함하는 방법.
  5. 제1항에 있어서,
    상기 웹페이지에 대응하는 데이터 구조의 내용을 저장하는 과정은,
    메모리에 로딩되어 있는 상기 데이터 구조의 전체 내용을 기록하는 과정을 포함하는 방법.
  6. 제1항에 있어서,
    상기 웹페이지 내에 동적 콘텐츠의 디스플레이를 일시 정지시키는 제어 이벤트가 발생할 때, 상기 웹페이지 내에 동적 콘텐츠의 변경내용에 대한 디스플레이를 정지시키는 과정을 더 포함하는 방법.
  7. 제6항에 있어서,
    상기 웹페이지 내에 동적 콘텐츠의 변경내용에 대한 디스플레이를 정지시키는 과정은,
    상기 웹페이지 내에 동적 콘텐츠를 디스플레이 하기 위한 재배치(re-layouting) 및 다시 그리기(repainting)를 정지하는 과정을 포함하는 방법.
  8. 제6항에 있어서,
    상기 웹페이지 내에 동적 콘텐츠의 디스플레이의 일시 정지를 해지시키는 과정과,
    현재 시점의 상기 웹페이지에 대응하는 데이터 구조의 내용을 독출하여 디스플레이하는 과정을 더 포함하는 방법.
  9. 제8항에 있어서,
    상기 웹페이지 내에 동적 콘텐츠의 디스플레이의 일시 정지를 해지시키는 과정은,
    상기 웹페이지 내에 동적 콘텐츠를 디스플레이 하기 위한 재배치(re-layouting) 및 다시 그리기(repainting)를 수행하는 과정을 포함하는 방법.
  10. 제1항에 있어서,
    상기 저장된 웹페이지에 대응하는 데이터 구조의 내용을 독출하여 디스플레이하는 과정은,
    상기 저장된 웹페이지에 대응하는 데이터 구조의 내용을 기반으로, 재배치(re-layouting) 및 다시 그리기(repainting)를 수행하는 과정을 포함하는 방법.
  11. 웹브라우저의 제1 명령에 따라, 현재 디스플레이되는 웹페이지 내에서 특정 콘텐츠의 디스플레이를 요청받는 과정과, 여기서, 상기 웹페이지를 렌더링하기 위한 데이터구조가 메모리에 저장되고,
    상기 특정 콘텐츠를 포함한 상기 웹페이지에 대응하는 상기 데이터구조의 변경내용을 이용하여, 상기 특정 콘텐츠를 포함한 상기 웹페이지를 디스플레이하는 과정을 포함하는 전자장치의 동작방법.
  12. 제11항에 있어서,
    상기 웹브라우저의 제1 명령에 따라, 현재 디스플레이되는 웹페이지 내에서 특정 콘텐츠의 디스플레이를 요청받는 과정은,
    상기 특정 콘텐츠를 포함한 상기 웹페이지에 대응하는 데이터구조의 내용을 검색하는 것임을 특징으로 포함하는 전자장치의 동작방법.
  13. 제11항에 있어서,
    상기 웹브라우저의 제2 명령에 따라, 상기 콘텐츠를 포함한 상기 웹페이지 내에서, 중지되어있는 동적인 콘텐츠 변경 동작을 다시 시작하는 과정을 더 포함하는 전자장치의 동작방법.
  14. 제11항에 있어서,
    상기 동적인 콘텐츠 변경 동작을 다시 시작하는 과정은,
    변하는 다른 콘텐츠를 포함한 웹페이지를 렌더링하기 상기 데이터구조의 변경내용을 고려하여, 상기 데이터구조의 재배치(re-layout) 및 다시 그리기(re-painting)를 수행하는 것을 특징으로 하는 전자장치의 동작방법.
  15. 제11항에 있어서,
    상기 웹브라우저의 상기 제1 명령이 실행되기 전에, 상기 웹브라우저의 제3 명령에 따라, 동적인 콘텐츠 변경 동작을 중지시키는 과정을 더 포함하되,
    현재 변하는 콘텐츠를 포함한 웹페이지를 렌더링하기 상기 데이터구조의 변경내용은 저장되는 것을 특징으로 하는 전자장치의 동작방법.
  16. 제15항에 있어서,
    상기 동적인 콘텐츠 변경 동작을 중지시키는 과정은,
    상기 현재 변하는 콘텐츠를 포함한 웹페이지를 렌더링하기 상기 데이터구조의 변경내용과 상관없이, 재배치(re-layout) 및 다시 그리기(re-painting)를 중지하는 것을 특징으로 하는 전자장치의 동작방법.
  17. 제15항에 있어서,
    상기 웹브라우저의 상기 제3 명령이 활성화될 때, 상기 웹브라우저의 제1 명령은 비활성화되고,
    상기 웹브라우저의 상기 제1 명령이 활성화될 때, 상기 웹브라우저의 제3 명령은 비활성화되는 것을 특징으로 하는 전자장치의 동작방법.
  18. 제11항에 있어서,
    상기 데이터구조의 변경내용을 메모리에 저장하는 과정을 더 포함하되,
    상기 저장 과정은, 상기 콘텐츠 변경에 대응하는 상기 데이터구조 내에 객체의 삽입/삭제/위치변경/스타일변경을 감지하는 과정과,
    상기 데이터구조 내 객체의 변경내용을 기록하는 과정을 포함하는 전자장치의 동작방법.
  19. 제11항에 있어서,
    상기 웹페이지를 디스플레이하는 과정 다음에 상기 웹페이지의 특정 영역을 선택하는 과정을 더 포함하고,
    상기 콘텐츠 변경은 상기 특정 영역의 콘텐츠 변경인 것을 특징으로 하는, 전자장치의 동작 방법.
  20. 제11항에 있어서,
    상기 데이터구조, DOM(Document Object Model) 트리형태의 데이터구조 및 렌더(render) 트리형태의 데이터구조 중 하나인 것을 특징으로 하는 전자장치의 동작방법.
  21. 하나 이상의 프로세서;
    메모리; 및
    상기 메모리에 저장되어 있으며 상기 하나 이상의 프로세서에 의하여 실행되도록 구성되는 하나 이상의 프로그램을 포함하는 전자장치로서,
    상기 프로그램은,
    웹페이지 내에 동적 콘텐츠가 포함되어 있을 때, 설정된 시점에서 상기 웹페이지에 대응하는 데이터 구조의 내용을 저장하고,
    특정 시점의 상기 웹페이지에 대응하는 데이터 구조의 내용을 독출 하는 이벤트가 발생할 시, 상기 저장된 웹페이지에 대응하는 데이터 구조의 내용을 독출하여 디스플레이하는 명령어들을 포함하는 전자장치.
  22. 제21항에 있어서,
    상기 설정된 시점은 일정 주기 또는 상기 동적 콘텐트가 변화는 시점인 것을 특징으로 하는 전자장치.
  23. 제21항에 있어서,
    상기 데이터 구조의 내용은 변경 내용인 것을 특징으로 하는 전자장치.
  24. 제21항에 있어서,
    상기 프로그램은,
    상기 데이터 구조 내에 객체의 삽입, 삭제, 위치변경, 속성변경 또는 스타일변경을 검출하고,
    상기 검출 결과에 대응하는 변경 내용을 기록하는 명령어를 포함하는 전자장치.
  25. 제21항에 있어서,
    상기 프로그램은,
    메모리에 로딩되어 있는 상기 데이터 구조의 전체 내용을 기록하는 명령어를 포함하는 전자장치.
  26. 제21항에 있어서,
    상기 프로그램은,
    상기 웹페이지 내에 동적 콘텐츠의 디스플레이를 일시 정지시키는 제어 이벤트가 발생할 때, 상기 웹페이지 내에 동적 콘텐츠의 변경내용에 대한 디스플레이를 정지시키는 명령어를 더 포함하는 전자장치.
  27. 제26항에 있어서,
    상기 프로그램은,
    상기 웹페이지 내에 동적 콘텐츠를 디스플레이 하기 위한 재배치(re-layouting) 및 다시 그리기(repainting)를 정지하는 명령어를 포함하는 전자장치.
  28. 제26항에 있어서,
    상기 프로그램은,
    상기 웹페이지 내에 동적 콘텐츠의 디스플레이의 일시 정지를 해지시키고,
    현재 시점의 상기 웹페이지에 대응하는 데이터 구조의 내용을 독출하여 디스플레이하는 명령어를 더 포함하는 전자장치.
  29. 제28항에 있어서,
    상기 프로그램은,
    상기 웹페이지 내에 동적 콘텐츠를 디스플레이 하기 위한 재배치(re-layouting) 및 다시 그리기(repainting)를 수행하는 것을 포함하는 전자장치.
  30. 제21항에 있어서,
    상기 프로그램은,
    상기 저장된 웹페이지에 대응하는 데이터 구조의 내용을 기반으로, 재배치(re-layouting) 및 다시 그리기(repainting)를 수행하는 명령어를 포함하는 전자장치.
  31. 하나 이상의 프로세서;
    메모리; 및
    상기 메모리에 저장되어 있으며 상기 하나 이상의 프로세서에 의하여 실행되도록 구성되는 하나 이상의 프로그램을 포함하는 전자장치로서,
    상기 프로그램은,
    웹브라우저의 제1 명령에 따라, 현재 디스플레이되는 웹페이지 내에서 특정 콘텐츠의 디스플레이를 요청받고, 여기서, 상기 웹페이지를 렌더링하기 위한 데이터구조가 메모리에 저장되고, 상기 특정 콘텐츠를 포함한 상기 웹페이지에 대응하는 상기 데이터구조의 변경내용을 이용하여, 상기 특정 콘텐츠를 포함한 상기 웹페이지를 디스플레이하는 명령어를 포함하는 전자장치.
  32. 제31항에 있어서,
    상기 웹브라우저의 제1 명령에 따라, 현재 디스플레이되는 웹페이지 내에서 특정 콘텐츠를 검색받는 명령어는,
    상기 특정 콘텐츠를 포함한 상기 웹페이지를 렌더링하기 위한 데이터구조의 내용을 검색하는 것임을 특징으로 포함하는 전자장치.
  33. 제31항에 있어서,
    상기 웹브라우저의 제2 명령에 따라, 상기 콘텐츠를 포함한 상기 웹페이지 내에서, 중지되어있는 동적인 콘텐츠 변경 동작을 다시 시작하는 명령어를 더 포함하는 전자장치.
  34. 제30항에 있어서,
    상기 동적인 콘텐츠 변경 동작을 다시 시작하는 명령어는,
    상기 콘텐츠 또는 변하는 다른 콘텐츠를 포함한 웹페이지를 렌더링하기 상기 데이터구조의 변경내용을 고려하여, 상기 데이터구조의 재배치(re-layout) 및 다시 그리기(re-painting)를 수행하는 것을 특징으로 하는 전자장치.
  35. 제31항에 있어서,
    상기 웹브라우저의 상기 제1 명령이 실행되기 전에, 상기 웹브라우저의 제3 명령에 따라, 동적인 콘텐츠 변경 동작을 중지시키는 명령어를 더 포함하되,
    현재 변하는 콘텐츠를 포함한 웹페이지를 렌더링하기 상기 데이터구조의 제3 변경에 관한 내용은 저장되는 것을 특징으로 하는 전자장치.
  36. 제35항에 있어서,
    상기 동적인 콘텐츠 변경 동작을 중지시키는 명령어는,
    상기 현재 변하는 콘텐츠를 포함한 웹페이지를 렌더링하기 상기 데이터구조의 변경내용과 상관없이, 상기 데이터구조의 재배치(re-layout) 및 다시 그리기(re-painting)를 중지하는 것을 특징으로 하는 전자장치.
  37. 제35항에 있어서,
    상기 웹브라우저의 상기 제3 명령이 활성화될 때, 상기 웹브라우저의 제1 명령은 비활성화되고,
    상기 웹브라우저의 상기 제1 명령이 활성화될 때, 상기 웹브라우저의 제3 명령은 비활성화되는 것을 특징으로 하는 전자장치.
  38. 제31항에 있어서,
    상기 데이터구조의 변경내용을 메모리에 저장하는 과정을 더 포함하되,
    상기 저장 과정은, 상기 콘텐츠에 대응하는 상기 데이터구조 내에 객체의 삽입/삭제/위치변경/스타일변경을 감지하는 과정과,
    상기 데이터구조 내 객체의 변경내용을 기록하는 과정을 포함하는 전자장치.
  39. 제31항에 있어서,
    상기 웹페이지를 디스플레이하는 과정 다음에 상기 웹페이지의 특정 영역을 선택하는 명령어를 더 포함하고,
    상기 콘텐츠 변경은 상기 특정 영역의 콘텐츠 변경인 것을 특징으로 하는, 전자장치.
  40. 제41항에 있어서,
    상기 데이터구조, DOM(Document Object Model) 트리형태의 데이터구조 및 렌더(render) 트리형태의 데이터구조 중 하나인 것을 특징으로 하는 전자장치.
KR1020130032112A 2013-03-26 2013-03-26 전자장치에서 동적으로 변하는 웹페이지 내용을 제어하는 방법 및 장치 KR20140117122A (ko)

Priority Applications (7)

Application Number Priority Date Filing Date Title
KR1020130032112A KR20140117122A (ko) 2013-03-26 2013-03-26 전자장치에서 동적으로 변하는 웹페이지 내용을 제어하는 방법 및 장치
JP2014062494A JP6027568B2 (ja) 2013-03-26 2014-03-25 電子装置における動的に変化するウェブページの内容を制御する方法及び装置
US14/224,235 US20140298159A1 (en) 2013-03-26 2014-03-25 Method for controlling dynamically changing contents of web page and electronic device thereof
PCT/KR2014/002475 WO2014157899A1 (en) 2013-03-26 2014-03-25 Method for controlling dynamically changing contents of web page and electronic device thereof
CN201410116669.7A CN104077348A (zh) 2013-03-26 2014-03-26 用于控制网页的动态改变的内容的方法及其电子装置
EP14161794.4A EP2784702A1 (en) 2013-03-26 2014-03-26 Method for controlling dynamically changing contents of web page and electronic device thereof
AU2014201798A AU2014201798B2 (en) 2013-03-26 2014-03-26 Method for controlling dynamically changing contents of web page and electronic device thereof

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
KR1020130032112A KR20140117122A (ko) 2013-03-26 2013-03-26 전자장치에서 동적으로 변하는 웹페이지 내용을 제어하는 방법 및 장치

Publications (1)

Publication Number Publication Date
KR20140117122A true KR20140117122A (ko) 2014-10-07

Family

ID=50391037

Family Applications (1)

Application Number Title Priority Date Filing Date
KR1020130032112A KR20140117122A (ko) 2013-03-26 2013-03-26 전자장치에서 동적으로 변하는 웹페이지 내용을 제어하는 방법 및 장치

Country Status (7)

Country Link
US (1) US20140298159A1 (ko)
EP (1) EP2784702A1 (ko)
JP (1) JP6027568B2 (ko)
KR (1) KR20140117122A (ko)
CN (1) CN104077348A (ko)
AU (1) AU2014201798B2 (ko)
WO (1) WO2014157899A1 (ko)

Families Citing this family (18)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN104063415B (zh) * 2014-02-27 2018-07-10 优视科技有限公司 显示网页自定义内容的方法及系统
KR102086731B1 (ko) * 2014-06-25 2020-04-14 에스케이플래닛 주식회사 클라우드 스트리밍 서비스 제공 방법, 이를 위한 장치 및 시스템, 그리고 이를 위한 클라우드 스트리밍용 스크립트 코드를 기록한 컴퓨터 판독 가능한 기록매체
JP6015967B2 (ja) * 2014-07-02 2016-10-26 インターナショナル・ビジネス・マシーンズ・コーポレーションＩｎｔｅｒｎａｔｉｏｎａｌ Ｂｕｓｉｎｅｓｓ Ｍａｃｈｉｎｅｓ Ｃｏｒｐｏｒａｔｉｏｎ ウェブ・ページを表示する装置およびプログラム
JP5832056B1 (ja) * 2014-10-06 2015-12-16 株式会社シンメトリック Ｗｅｂページの表示のためのプログラム、端末装置、およびサーバ装置
CN105808629B (zh) * 2014-12-31 2020-08-21 阿里巴巴（中国）有限公司 一种网页处理方法及装置
US11501054B2 (en) 2016-06-12 2022-11-15 Apple Inc. Layout generation for an electronic document that includes a web object
US10372785B2 (en) * 2016-07-29 2019-08-06 Microsoft Technology Licensing, Llc Client-side modularization of a requested webpage
US10970465B2 (en) * 2016-08-24 2021-04-06 Micro Focus Llc Web page manipulation
KR101898599B1 (ko) * 2017-04-13 2018-10-04 박준규 스티커식 단어장
CN110235181B (zh) * 2017-06-13 2023-09-29 谷歌有限责任公司 用于生成跨浏览器兼容动画的系统和方法
CN108804584A (zh) * 2018-05-25 2018-11-13 北京五八信息技术有限公司 数据展示方法、装置、设备及存储介质
CN108959495B (zh) * 2018-06-25 2019-12-06 百度在线网络技术（北京）有限公司 H5网页的页面显示方法、装置、设备和计算机存储介质
CN110968809B (zh) * 2018-09-29 2021-08-03 北京字节跳动网络技术有限公司 一种网页处理方法、装置、电子设备及存储介质
CN109543127B (zh) * 2018-11-26 2020-12-11 杭州安恒信息技术股份有限公司 一种页面刷新方法、装置、设备及可读存储介质
CN110955480B (zh) * 2019-11-20 2024-02-23 北京金山猎豹科技有限公司 一种视图显示方法和装置
US11483371B2 (en) * 2020-11-23 2022-10-25 International Business Machines Corporation User-derived webpage activity control
JP7299948B2 (ja) * 2021-07-20 2023-06-28 Ｎｅｃパーソナルコンピュータ株式会社 情報処理装置及びその表示制御方法並びにプログラム
US20240112382A1 (en) * 2022-10-04 2024-04-04 International Business Machines Corporation Layering modifications defined in a rule on a set of objects detected within a frame

Family Cites Families (16)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
JP2002064632A (ja) * 2000-08-08 2002-02-28 Passcall Advanced Technologies Ltd コンピュータを使用せずにインターネットのような情報ネットワークをサーフィングするためのシステムと方法
US7076495B2 (en) * 2001-04-26 2006-07-11 International Business Machines Corporation Browser rewind and replay feature for transient messages by periodically capturing screen images
US20020161634A1 (en) * 2001-04-27 2002-10-31 Koninklijke Philips Electronics N.V. Electronic document with an automatically updated portion
US7860820B1 (en) * 2005-05-31 2010-12-28 Vignette Software, LLC System using content generator for dynamically regenerating one or more fragments of web page based on notification of content change
US20050119913A1 (en) * 2003-12-01 2005-06-02 International Business Machines Corporation Subscription-based dynamic content update
US7941786B2 (en) * 2004-09-08 2011-05-10 Universal Electronics Inc. Configurable controlling device and associated configuration distribution system and method
US7461162B2 (en) * 2004-12-16 2008-12-02 International Business Machines Corporation Usage consciousness in HTTP/HTML for reducing unused data flow across a network
KR100793428B1 (ko) * 2006-06-23 2008-01-11 주식회사 케이티프리텔 무선 서비스 페이지 제공 방법 및 시스템
US8306859B2 (en) * 2006-07-21 2012-11-06 Say Media, Inc. Dynamic configuration of an advertisement
US9417758B2 (en) * 2006-11-21 2016-08-16 Daniel E. Tsai AD-HOC web content player
KR100946922B1 (ko) * 2007-10-25 2010-03-09 에스케이 텔레콤주식회사 블록 북마크를 이용한 동적 컨텐츠 제공 방법 및 시스템
US20110106637A1 (en) * 2008-06-12 2011-05-05 Norio Goto Program, information processing apparatus, information processing method, and information management apparatus
JP2010026974A (ja) * 2008-07-24 2010-02-04 Oki Electric Ind Co Ltd Ｗｅｂサイトのリアルタイム型ストリーミングによるプレビューシステムおよびその作動方法
US9311425B2 (en) * 2009-03-31 2016-04-12 Qualcomm Incorporated Rendering a page using a previously stored DOM associated with a different page
US20100332967A1 (en) * 2009-06-25 2010-12-30 Yahoo! Inc. System and method for automatically generating web page augmentation
CN102024003A (zh) * 2009-09-11 2011-04-20 上海东方宽频传播有限公司 视频广告资讯轮替切换的方法

Also Published As

Publication number Publication date
AU2014201798B2 (en) 2015-12-03
AU2014201798A1 (en) 2014-10-16
EP2784702A1 (en) 2014-10-01
JP6027568B2 (ja) 2016-11-16
WO2014157899A1 (en) 2014-10-02
CN104077348A (zh) 2014-10-01
JP2014191827A (ja) 2014-10-06
US20140298159A1 (en) 2014-10-02

Similar Documents

Publication Publication Date Title
JP6027568B2 (ja) 電子装置における動的に変化するウェブページの内容を制御する方法及び装置
KR102436987B1 (ko) 웹페이지 콘텐츠를 추출하기 위한 방법 및 단말 장치
KR102113272B1 (ko) 전자장치에서 복사/붙여넣기 방법 및 장치
JP5592433B2 (ja) 手持ち式電子装置及びそのマルチメディアクリップ記録方法
AU2014200500B2 (en) Method and apparatus for adjusting attribute of specific object in web page in electronic device
US9250765B2 (en) Changing icons for a web page
KR101962980B1 (ko) 마크업 기반의 문서에서의 정보에 근거한 데이터 분할
JP6440828B2 (ja) デジタルコンテンツの可視性の検出
KR20130106519A (ko) 웹 브라우저의 히스토리 관리 방법 및 장치
US20120235933A1 (en) Mobile terminal and recording medium
TW201525836A (zh) 頁面操作回饋的方法和裝置
CN110506267B (zh) 数字组件背景渲染
JP2010009516A (ja) 端末装置及びデータ処理方法
CN110069734A (zh) 一种页面组件的展现方法和装置
US20190163439A1 (en) Voice broadcast method and apparatus
WO2015167511A2 (en) Adjusting tap position on touch screen
KR101969583B1 (ko) 컨텐츠 관리 방법과 장치 및 기록 매체
US9524076B2 (en) Web page management method and apparatus and storage medium thereof
KR20100010299A (ko) 어플리케이션의 포커스 제어 방법 및 장치
KR20090027118A (ko) 멀티미디어 콘텐츠 제공 시스템 및 방법
US20150074530A1 (en) Method for controlling content in mobile electronic device
CN114020309B (zh) 通过webpack构建多页面应用的方法、装置及存储介质
KR101402362B1 (ko) 웹 애플리케이션을 제어하기 위한 방법, 단말 장치, 서버 및 컴퓨터 판독 가능한 기록 매체
CN109844760B (zh) 时间相关墨水
CN106033446A (zh) 网页内容展示方法及网页内容展示装置

Legal Events

Date Code Title Description
A201 Request for examination
E902 Notification of reason for refusal
E601 Decision to refuse application