The Current Status of HTML5 Technology and Standard The

Total Page:16

File Type:pdf, Size:1020Kb

The Current Status of HTML5 Technology and Standard The The current status of HTML5 technology and standard HTML5 관련 최근 주요업계 동향은 ? 22 HTML5 vs (Flash vs Silverlight) 33 44 <Source: http://www.apple.com/ipad/ready-for-ipad/ > <Source: http://www.apple.com/html5/ > 55 66 <Source: http://mashable.com/2010/05/07/google-reader- adds-html5-support/> 77 <Source: http://www.computerworld.com/s/article/print/9178558/Google_to_use_HTML5_i n_Gmail?taxonomyName=App+Development&taxonomyId=11 > 88 Google to use HTML5 in Gmail Speed is a feature Goal is to get Gmail to load in under a second Offline support HTML5's database standards New features downloadurl: a new data transfer protocol HTML6 ??? Code size 443,000 lines of JavaScript 978,000 lines with comments 99 Google I/O Conference Chrome Web Store an existing web app a serverless app 1010 Google I/O Conference HTML5 Tweetdeck App 11 11 Google I/O Conference WebM Project 12 12 <Source: http://www.html5rocks.com/> 13 13 < Source: http://thenextweb.com/apps/2010/03/04/internet-explorer-9-html5-c ompatible-microsoft-joining-antiflash-movement/ > 1414 IE9 : HTML5와 GPU <Source: IE9 : HTML5와 GPU 발표자료 (황리건) > 15 15 MS IE9 Preview #3까지 출시 HTML5 비디오/오디오와 SVG 지원 예정 GPU 활용한 랜더링 기능 지원 IE9 공식 버전은 언제 출시 ??? HTML5를 지원하는 모바일 브라우저 로드맵은 ??? 1616 17 17 H.264: 31% ( Q2/09 ) 66% ( Q1/10 ) Flash : 69% ( Q2/09 ) 26% ( Q1/10 ) <Source: Encoding.com via TechCrunch> 1818 HTML5 표준 개요 및 특징은? 19 19 HTML Timeline 20 20 [ Source : Appleinsider ] What is HTML5 ? Structure and Semantic APIs 2121 HTML Design Principles <Source: http://www.w3.org/TR/html-design-principles/ > 22 22 Document Representations (문서 표현) HTML 5 XHTML 5 Document application/xhtml+xml text/html DOM The DOCTYPE <!DOCTYPE html> Just 15 character HTML5 doc !!! Case-insensitive Backwards compatibility How about Google page ? Is it based on the HTML5 ? 2424 HTML5 Basic Structure Common structures Differentiation & Style. How about Semantic? What is the potential of new elements? E.g. Search engine, etc [ HTML4] 2525 [ HTML5] Example 26 26 New Elements in HTML5 New Markup Elements – for better structure New Media Elements – for media content The Canvas Element – for drawing New Form Elements and Input type attribute values 2727 New Markup Elements – for better structure <mark> for indicating text as marked or highlighted <time> for declaring the date and/or time within an HTML document. 2828 New Markup Elements – for better structure <meter> for indicating a scalar measurement within a known range, or a frac tional value <progress> for representing the progress of a task 2929 New Markup Elements – for better structure Tag Description For external content, like text from a news-article, blog, forum, or any ot <article> her content from an external source For content aside from the content it is placed in. The aside content shoul <aside> d be related to the surrounding content <command> A button, or a radiobutton, or a checkbox <details> For describing details about a document, or parts of a document <summary> A caption, or summary, inside the details element <figure> For grouping a section of stand-alone content, could be a video <figcaption> The caption of the figure section For a footer of a document or section, could include the name of the auth <footer> or, the date of the document, contact information, or copyright informati on <header> For an introduction of a document or section, could include navigation For a section of headings, using <h1> to <h6>, where the largest is the mai <hgroup> n heading of the section, and the others are sub-headings 3030 New Markup Elements – for better structure Tag Description <mark> For text that should be highlighted For a measurement, used only if the maximum and minimum values are k <meter> nown <nav> For a section of navigation <progress> The state of a work in progress <ruby> For ruby annotation (Chinese notes or characters) <rt> For explanation of the ruby annotation <rp> What to show browsers that do not support the ruby element For a section in a document. Such as chapters, headers, footers, or any ot <section> her sections of the document <time> For defining a time or a date, or both 3131 New Media Elements – for media content Tag Description <audio> For multimedia content, sounds, music or other audio streams <video> For video content, such as a movie clip or other video streams For media resources for media elements, defined inside video or audio ele <source> ments <embed> For embedded content, such as a plug-in 3232 New Form Elements and Input type attribute values Tag Description <datalist> A list of options for input values <keygen> Generate keys to authenticate users <output> For different types of output, such as output written by a script 3333 New Form Elements and Input type attribute values Type Description tel The input value is of type telephone number search The input field is a search field url The input value is a URL email The input value is one or more email addresses datetime The input value is a date and/or time date The input value is a date month The input value is a month week The input value is a week time The input value is of type time datetime-local The input value is a local date/time number The input value is a number range The input value is a number in a given range color The input value is a hexadecimal color, like #FF8800 3434 Web Forms Placeholder text An autofocus attribute 3535 Web Forms 36 36 Form Demo HTML5 input UI support Payment form 3737 (Reference) HTML5 elements 28 New Elements are added & 7 elements are changed 3838 HTML5 Features Canvas / SVG Local Storage Video / Audio Web Socket Geolocation Web Workers Offline web apps More features … Web SQL Database 3939 Canvas What is Canvas ? Dynamic and interactive graphics Draw images using 2D drawing API •Lines, curves, shapes, fills, etc. Useful for Graphs, Applications, Games, etc. [http://www.liquidx.net/plotkit/ ] [ http://canvaspaint.org/ ] [http://www.benjoffe.com/code/demos/canvascape/] 4040 Canvas Example <canvas id="myDrawing" width="200" height="200"> </canvas> <h1>Hello World!</h1> var drawingCanvas = document.getElementById('myDrawing'); var context = drawingCanvas.getContext('2d'); // Create the yellow face context.strokeStyle = "#000000"; context.fillStyle = "#FFFF00"; context.beginPath(); context.arc(100,100,50,0,Math.PI*2,true); context.closePath(); context.stroke(); context.fill(); 4141 Canvas Demo Appspot RectangleWave Canvascape - "Experimenting With Textures“ Depth of Field 4242 SVG What is SVG ? Scalable Vector Graphic HTML-like tags for drawing <!DOCTYPE html> <html> <body> <svg width="200" height="200"> <rect x="0" y="0" width="100" height="100" fill="blue" stroke="red" stroke-width="5px" rx="8" ry="8" id="myRect" class="chart" /> </svg> </body> </html> 4343 SVG Demo Photos SVG Filter 4444 Video / Audio HTML4에서 Flash 동영상 추가 45 45 Video / Audio Embedding multimedia will get easier through the user of tags like <audio> and <video> <Source: Dive into html5> 4646 Video / Audio 마크업 <video> and <audio> as easy as <img> 애트리뷰트 •src, width, height, controls, poster, autoplay, autobuffer, loop 하나 이상의 미디어 타입 처리 4747 Video / Audio 자바스크립트 메소드 •play(), pause() 애트리뷰트 •volume, muted, currentTime 이벤트 •loadeddata, play, pause, timeupdate, ended 4848 Video Demo CanvasVideo Video Showcase (Apple) 4949 Geolocation Geolocation API brings browser-based location to your apps navigator.geolocation.getCurrentPosition( function(position) { var lat = position.coords.latitude; var lon = position.coords.longitude; showLocation(lat, lon); } ); 5050 Offline Web Apps Web apps need to work everywhere Database and app cache store user data and app resources locally 5151 Offline Web Apps App Cache List resources that you want to take offline cache.manifest file /static/stickies.html /media/deleteButton.png /media/deleteButtonPressed.png /css /stickies.css /js/stickies.js HTML file <body manifest="./cache.manifest"> </body> 5252 Web SQL Database Databases right in the browser Around 5MB per domain Accessible across tabs and windows Based on SQLite Features: Transaction, SQL queries var db = window.openDatabase (" NoteTest ", "1.0“, "Example DB“, 200000); function saveMe(id, text, timestamp, left, top, zIndex) { db.transaction( function (tx) { tx.executeSql( "INSERT INTO WebKitStickyNotes " + "(id, note, timestamp, left, top, zindex) " + "VALUES (?, ?, ?, ?, ?, ?)", [id, text, timestamp, left, top, zIndex]); } ); 5353} Web Storage Key/value pair (hash) storage Hash-based storage of strings (not objects). 10 MB per zone. Two kinds: sessionStorage: •Die when browser closes •Not shared between tabs localStorage •Crash-safe •Shared BW tabs / windows and sessions – but not zones. 5454 Web Sockets TCP for the Web a next-generation bidirectional communication technology for web applications if ("WebSocket" in window) { var ws = new WebSocket("ws://example.com/service"); ws.onopen = function() { // Web Socket is connected. You can send data by send() method. ws.send("message to send"); .... }; ws.onmessage = function (evt) { var received_msg = evt.data; ... }; ws.onclose = function() { // websocket is closed. }; } else { // the browser doesn't support WebSocket. } 5555 Web Sockets 구글 크롬 개발자 채널 버전 4.0.249.0. Web Socket을 기본기능으로 지원 Web Socket extension for Apache HTTP Server pywebsocket •testing or experimental purposes •mod_pywebsocket •mod_python •mod_ssl for wss •http://code.google.com/p/pywebsocket/ jWebSocket http://jwebsocket.org/ 5656 Web Sockets HTML5 Web Sockets and the Need for Speed! The Web Sockets experience is 55 times faster than XHR http://www.kaazing.com/blog/?p=301 http://bloga.jp/ws/jq/wakachi/mecab/wakachi.html ( Demo ) 5757 Web Workers API for running background scripts Threads for Web apps Browser Support Firefox 3.5 Safari 4 Chrome 4 Useful for gaming, graphics, crypto and etc. 5858 Web Workers Workers ‘parent’ page 접근 제한 예제 The parent page <script> var worker = new Worker('worker.js'); worker.onmessage = function (event) { console.log('Results: ' + event.data); }; </script> worker.js function findPrimes() { // ..
Recommended publications
  • Amazon Silk Developer Guide Amazon Silk Developer Guide
    Amazon Silk Developer Guide Amazon Silk Developer Guide Amazon Silk: Developer Guide Copyright © 2015 Amazon Web Services, Inc. and/or its affiliates. All rights reserved. The following are trademarks of Amazon Web Services, Inc.: Amazon, Amazon Web Services Design, AWS, Amazon CloudFront, AWS CloudTrail, AWS CodeDeploy, Amazon Cognito, Amazon DevPay, DynamoDB, ElastiCache, Amazon EC2, Amazon Elastic Compute Cloud, Amazon Glacier, Amazon Kinesis, Kindle, Kindle Fire, AWS Marketplace Design, Mechanical Turk, Amazon Redshift, Amazon Route 53, Amazon S3, Amazon VPC, and Amazon WorkDocs. In addition, Amazon.com graphics, logos, page headers, button icons, scripts, and service names are trademarks, or trade dress of Amazon in the U.S. and/or other countries. Amazon©s trademarks and trade dress may not be used in connection with any product or service that is not Amazon©s, in any manner that is likely to cause confusion among customers, or in any manner that disparages or discredits Amazon. All other trademarks not owned by Amazon are the property of their respective owners, who may or may not be affiliated with, connected to, or sponsored by Amazon. AWS documentation posted on the Alpha server is for internal testing and review purposes only. It is not intended for external customers. Amazon Silk Developer Guide Table of Contents What Is Amazon Silk? .................................................................................................................... 1 Split Browser Architecture ......................................................................................................
    [Show full text]
  • Lucas Edi Cordeiro De Brito
    UNIVERSIDADE FEDERAL DE CAMPINA GRANDE CENTRO DE ENGENHARIA ELÉTRICA E INFORMÁTICA UNIDADE ACADÊMICA DE SISTEMAS E COMPUTAÇÃO CURSO DE BACHARELADO EM CIÊNCIA DA COMPUTAÇÃO LUCAS EDI CORDEIRO DE BRITO ANÁLISE COMPARATIVA ENTRE WEBASSEMBLY E JAVASCRIPT COMO ALVOS DE COMPILAÇÃO CAMPINA GRANDE ­ PB 2019 LUCAS EDI CORDEIRO DE BRITO ANÁLISE COMPARATIVA ENTRE WEBASSEMBLY E JAVASCRIPT COMO ALVOS DE COMPILAÇÃO Trabalho de Conclusão Curso apresentado ao Curso Bacharelado em Ciência da Computação do Centro de Engenharia Elétrica e Informática da Universidade Federal de Campina Grande, como requisito parcial para obtenção do título de Bacharel em Ciência da Computação. Orientador: Professor Dr. Matheus Gaudencio do Rêgo. CAMPINA GRANDE ­ PB 2019 B862a Brito, Lucas Edi Cordeiro de. Análise comparativa entre WebAssembly e JavaScript como alvos de compilação. / Lucas Edi Cordeiro de Brito. – 2019. 11 f. Orientador: Prof. Dr. Matheus Gaudencio do Rêgo Trabalho de Conclusão de Curso - Artigo (Curso de Bacharelado em Ciência da Computação) - Universidade Federal de Campina Grande; Centro de Engenharia Elétrica e Informática. 1. WebAssembly. 2. JavaScript. 3. Emscripten. 4. Asm.js - Mozila. 5. Navegadores web. 6. Linguagem de programação - web. 7. Aplicativos web – linguagem de programação. I. Rêgo, Matheus Gaudencio do. II. Título. CDU:004(045) Elaboração da Ficha Catalográfica: Johnny Rodrigues Barbosa Bibliotecário-Documentalista CRB-15/626 LUCAS EDI CORDEIRO DE BRITO ANÁLISE COMPARATIVA ENTRE WEBASSEMBLY E JAVASCRIPT COMO ALVOS DE COMPILAÇÃO Trabalho de Conclusão Curso apresentado ao Curso Bacharelado em Ciência da Computação do Centro de Engenharia Elétrica e Informática da Universidade Federal de Campina Grande, como requisito parcial para obtenção do título de Bacharel em Ciência da Computação.
    [Show full text]
  • Security Considerations Around the Usage of Client-Side Storage Apis
    Security considerations around the usage of client-side storage APIs Stefano Belloro (BBC) Alexios Mylonas (Bournemouth University) Technical Report No. BUCSR-2018-01 January 12 2018 ABSTRACT Web Storage, Indexed Database API and Web SQL Database are primitives that allow web browsers to store information in the client in a much more advanced way compared to other techniques such as HTTP Cookies. They were originally introduced with the goal of enhancing the capabilities of websites, however, they are often exploited as a way of tracking users across multiple sessions and websites. This work is divided in two parts. First, it quantifies the usage of these three primitives in the context of user tracking. This is done by performing a large-scale analysis on the usage of these techniques in the wild. The results highlight that code snippets belonging to those primitives can be found in tracking scripts at a surprising high rate, suggesting that user tracking is a major use case of these technologies. The second part reviews of the effectiveness of the removal of client-side storage data in modern browsers. A web application, built for specifically for this study, is used to highlight that it is often extremely hard, if not impossible, for users to remove personal data stored using the three primitives considered. This finding has significant implications, because those techniques are often uses as vector for cookie resurrection. CONTENTS Abstract ........................................................................................................................
    [Show full text]
  • CTA Specification, CTA-5000) and W3C (As a Final Community Group Report), by Agreement Between the Two Organizations
    CCTTAA SSppeecciiffiiccaattiioonn Web Application Video Ecosystem – Web Media API Snapshot 2017 CTA-5000 December 2017 NOTICE Consumer Technology Association (CTA)™ Standards, Bulletins and other technical publications are designed to serve the public interest through eliminating misunderstandings between manufacturers and purchasers, facilitating interchangeability and improvement of products, and assisting the purchaser in selecting and obtaining with minimum delay the proper product for his particular need. Existence of such Standards, Bulletins and other technical publications shall not in any respect preclude any member or nonmember of the Consumer Technology Association from manufacturing or selling products not conforming to such Standards, Bulletins or other technical publications, nor shall the existence of such Standards, Bulletins and other technical publications preclude their voluntary use by those other than Consumer Technology Association members, whether the document is to be used either domestically or internationally. WAVE Specifications are developed under the WAVE Rules of Procedure, which can be accessed at the WAVE public home page (https://cta.tech/Research-Standards/Standards- Documents/WAVE-Project/WAVE-Project.aspx) WAVE Specifications are adopted by the Consumer Technology Association in accordance with clause 5.4 of the WAVE Rules of Procedures regarding patent policy. By such action, the Consumer Technology Association does not assume any liability to any patent owner, nor does it assume any obligation whatever to parties adopting the Standard, Bulletin or other technical publication. This document does not purport to address all safety problems associated with its use or all applicable regulatory requirements. It is the responsibility of the user of this document to establish appropriate safety and health practices and to determine the applicability of regulatory limitations before its use.
    [Show full text]
  • Insights Into Webassembly: Compilation Performance and Shared Code Caching in Node.Js
    Insights into WebAssembly: Compilation Performance and Shared Code Caching in Node.js Tobias Nießen Michael Dawson Faculty of Computer Science IBM Runtime Technologies University of New Brunswick IBM Canada [email protected] [email protected] Panos Patros Kenneth B. Kent Software Engineering Faculty of Computer Science University of Waikato University of New Brunswick [email protected] [email protected] ABSTRACT high-level languages, the WebAssembly instruction set is closely re- Alongside JavaScript, V8 and Node.js have become essential com- lated to actual instruction sets of modern processors, since the initial ponents of contemporary web and cloud applications. With the WebAssembly specification does not contain high-level concepts addition of WebAssembly to the web, developers finally have a fast such as objects or garbage collection [8]. Because of the similarity of platform for performance-critical code. However, this addition also the WebAssembly instruction set to physical processor instruction introduces new challenges to client and server applications. New sets, many existing “low-level” languages can already be compiled application architectures, such as serverless computing, require to WebAssembly, including C, C++, and Rust. instantaneous performance without long startup times. In this pa- WebAssembly also features an interesting combination of secu- per, we investigate the performance of WebAssembly compilation rity properties. By design, WebAssembly can only interact with its in V8 and Node.js, and present the design and implementation of host environment through an application-specific interface. There a multi-process shared code cache for Node.js applications. We is no built-in concept of system calls, but they can be implemented demonstrate how such a cache can significantly increase applica- through explicitly imported functions.
    [Show full text]
  • Universal High-Performance Applications with Webassembly
    ISSN:0975-9646 Jebreel Alamari et al, / (IJCSIT) International Journal of Computer Science and Information Technologies, Vol. 11 (6) , 2020, 102-106 Universal High-Performance Applications with WebAssembly Jebreel Alamari C.Edward Chow Computer Science Department Computer Science Department University of Colorado at University of Colorado at Colorado Springs Colorado Springs [email protected] [email protected] Abstract— Building and maintaining applications is an Browsers do not stop at that point. They try to run that code expensive operation. According to Kinvey report, building an efficiently and at a high speed. Since JavaScript is the main enterprise level mobile application costs about $270k. programming language for computation in the browsers, Supporting multiple platforms and operating systems is the after the failure of Java Applets [6], it became feasible to driving cost of the development process. In this paper we optimize browser engines to run JavaScript code faster. investigate the possibility of using web browsers as computation containers that allow code to run independently from the One of inaccurate ideas about JavaScript is that it is slow, underlying operating system. Progressive Web Applications and it is only good to do form processing with some fun became popular in the recent years, however their performance animation in the web page. Sure, JavaScript can do all that, still worries developers. Therefore, in this paper we concentrate but nowadays it can do much more. on the performance aspect of web applications. Even though it is still considered a loosely typed language Keywords— (web applications, universal applications, web with an interpreter, its performance has dramatically browsers, web assembly, JavaScript, WebAssembly) improved [7].
    [Show full text]
  • Using Indexeddb with a Spatial Database
    Linköpings Universitet | Institutionen för Datavetenskap Examenarbete, 16 hp | Innovativ Programmering Vårterminen 2018 | LIU-IDA/LITH-EX-G--18/049--SE Using IndexedDB with a spatial database Ludvig Eriksson Handledare: Erik Berglund Examinator: Anders Fröberg Linköping University SE-581 83 Linköping 013-28 10 00, www.liu.se Using IndexedDB with a spatial database Ludvig Eriksson Linköping University Norrköping, Sweden [email protected] ABSTRACT In addition to having the advantage for the user of requiring Web technologies are becoming increasingly useful with a lower effort to visit, PWAs also have other advantages new features and the gap to native apps is narrowing. over mobile apps for the developers. With them you don’t Recently, IndexedDB was added to the web standard to have to maintain separate code bases for different device provide large scale storage solutions directly in the types, screen sizes or operating systems. This can be both browser. Is it performant enough to be used with a spatial economically more desirable and require fewer resources database? In this study, such a system is developed for for companies that are building systems for mobile Foran Sverige AB and we learn that IndexedDB indeed can platforms. be used for this purpose. Even storage demanding Motivation geospatial applications can be developed as a multi- Foran Sverige AB develops systems for gathering, platform system with a single codebase, all while analyzing and presentation of forestry and nature data3. broadening the possible audience reach by avoiding an app When clients are out in the field, often the mobile reception installation process. isn’t optimal and load times can be unreasonably slow, if Author Keywords present at all.
    [Show full text]
  • Aplicação Web Para Dispositivos Móveis Com Inputs De Nova Geração
    Aplicação web para dispositivos móveis com inputs de nova geração Protótipo de aplicação web, na área da cultura, que fornece pontos de interesse baseados na localização do utilizador, simpli!cando a sua utilização em movimento VÍTOR ÂNGELO MAGALHÃES MARINHO Licenciado em Artes Plásticas - Escultura - pela Faculdade de Belas Artes da Universidade do Porto DISSERTAÇÃO SUBMETIDA PARA SATISFAÇÃO PARCIAL DOS REQUISITOS DO GRAU DE MESTRE EM MULTIMÉDIA Realizada sob orientação do Professor Doutor José Miguel Santos Araújo Carvalhais Fonseca, Faculdade de Belas Artes da Universidade do Porto Porto, setembro de 2011 II Em memória do Fidalgo “Life is what happens to you While you're busy making other plans” (John Lennon) III IV Agradecimentos Quero agradecer primeiro de tudo aos meus pais por estarem sempre ao meu lado e desta vez não foi exceção, o seu incentivo, apoio, carinho, amizade, energia e paciência foram incríveis. À minha irmã por ouvir os meus desabafos, pela paciência, pelos conselhos e por todo o seu apoio. Sem eles, tudo teria sido muito mais difícil. Ao Prof. Dr. Miguel Carvalhais, por ter aceite participar neste desa!o tendo em conta todas as particularidades que envolviam este projeto. Agradeço a sua orientação, aconselhamento, disponibilidade, respostas céleres, sugestões, críticas construtivas e partilha dos seus conhecimentos nas diversas áreas. Não poderia deixar de referir ainda, o Prof. Dr. Carlos Oliveira pelos seus conselhos e ajuda numa fase inicial. Gostaria igualmente de agradecer, à Filipa Almeida, ao João Angélico e à Maria Van Zeller pelos seus conselhos iniciais. Ao Carlos Fernandes e Fernando Mesquita pela ajuda em dois momentos.
    [Show full text]
  • 03-Html5-Bostonweb.Pdf
    Introduction to HTML5 Michael(tm) Smith [email protected] http://people.w3.org/mike sideshowbarker on Twitter, etc. I work for the W3C in Japan, based at Keio University near Tokyo My official W3C title is: Special Missions Subsection Junior Interim Floor Manager Where to start learning about HTML5? HTML5 differences from HTML4 http://w3.org/TR/html5-diff/ Tutorials and how-to guidance Dive into HTML5 http://diveintohtml5.org/ The HTML5 Doctors http://html5doctor.com/ Alternative authoring references HTML5 (Author Edition) http://dev.w3.org/html5/ spec-author-view HTML5: The Markup Language http://dev.w3.org/html5/ markup HTML5 differences • Syntax simplifications • MathML and SVG integration • New elements/attributes added • Removed old elements/attributes • Added new APIs for scripting Syntax simplifications <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/ DTD/xhtml1-transitional.dtd"> <!doctype html> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta charset="Shift_JIS"> New elements • <video> & <audio> (no plugins) • <canvas> (scriptable image) • <ruby> (annotations) • <article>, <section>, <header> • <details>, <progress>, more... New attributes • draggable (drag-and-drop) • contenteditable (editable pages) • spellcheck (catch spelling errors) • new form attributes (for client- side validation, plus new form controls such as date picker, etc.) Elements and attributes removed or obsoleted • <frame>, <frameset> • <a name> • more... New APIs for scripting • API for <video> & <audio> • 2D drawing API for <canvas> • getElementsByClassName() • innerHTML • more... HTML design principles http://w3.org/TR/html-design-principles/ HTML design principles • Support existing content • Ensure interoperability • Precisely define UA behavior • Handle errors (non-draconian) • Evolution not revolution Important point: HTML5 includes XHTML Frequently Asked Questions (FAQ) about the future of XHTML http://w3.org/2009/06/xhtml-faq.html About error handling..
    [Show full text]
  • Amazon Silk User Guide Amazon Silk User Guide
    Amazon Silk User Guide Amazon Silk User Guide Amazon Silk: User Guide Copyright © Amazon Web Services, Inc. and/or its affiliates. All rights reserved. Amazon's trademarks and trade dress may not be used in connection with any product or service that is not Amazon's, in any manner that is likely to cause confusion among customers, or in any manner that disparages or discredits Amazon. All other trademarks not owned by Amazon are the property of their respective owners, who may or may not be affiliated with, connected to, or sponsored by Amazon. Amazon Silk User Guide Table of Contents What is Amazon Silk? ......................................................................................................................... 1 Silk on Fire Tablet ...................................................................................................................... 1 Silk on Fire TV ........................................................................................................................... 1 Silk on Echo Show ..................................................................................................................... 2 Getting Started with Amazon Silk ........................................................................................................ 5 Are You an Amazon Silk User? ..................................................................................................... 5 Are You a Site Owner? ...............................................................................................................
    [Show full text]
  • Most Websites Don't Need to Vibrate: a Cost–Benefit Approach To
    Most Websites Don’t Need to Vibrate: A Cost–Benefit Approach to Improving Browser Security Peter Snyder Cynthia Taylor Chris Kanich University Of Illinois at Chicago University Of Illinois at Chicago University Of Illinois at Chicago [email protected] [email protected] [email protected] ABSTRACT Firefox OS, have expanded the Web API tremendously. Modern Modern web browsers have accrued an incredibly broad set of browsers have, for example, gained the ability to detect changes features since being invented for hypermedia dissemination in in ambient light levels [58], perform complex audio synthesis [14], 1990. Many of these features benefit users by enabling new types enforce digital rights management systems [25], cause vibrations of web applications. However, some features also bring risk to in enabled devices [36], and create peer to peer networks [11]. users’ privacy and security, whether through implementation error, While the web has picked up new capabilities, the security model unexpected composition, or unintended use. Currently there is underlying the Web API has remained largely unchanged. All web- no general methodology for weighing these costs and benefits. sites have access to nearly all browser capabilities. Unintended in- Restricting access to only the features which are necessary for formation leaks caused by these capabilities have been leveraged by delivering desired functionality on a given website would allow attackers in several ways: for instance, WebGL and Canvas allowed users to enforce the principle of lease privilege on use of the myriad Cao et al. to construct resilient cross-browser fingerprints [21], and APIs present in the modern web browser. Gras et al.
    [Show full text]
  • 2.4 Database Replication
    Master’s Thesis Optimizing team collaboration web applications through local storage and synchronization Dennis Andersen & Andreas Nilsson Department of Computer Science Faculty of Engineering LTH Lund University, 2013 ISSN 1650-2884 LU-CS-EX: 2013-34 Optimizing team collaboration web applications through local storage and synchronization Dennis Andersen Andreas Nilsson [email protected] [email protected] September 9, 2013 Master's thesis work carried out at RefinedWiki AB. Supervisor: Björn Johnsson, [email protected] Examiner: Per Andersson, [email protected] Abstract Team collaboration software is a great way for people to share their work. But often the need arises for accessing the work while on the go using limited net- work connections. The ongoing development in the area of HTML5 and web applications has opened up many new possibilities, especially for storing data locally. In this thesis we extensively test and compare these new solutions to find the best alternative. Along with testing and comparing techniques for database repli- cation and synchronization we hope to combine the two, enhancing the user experience by optimizing the team collaboration web application. Keywords: Database, replication, HTML5, local storage, optimization ii Acknowledgements We would like to thank the people over at RefinedWiki for providing us with a great work- ing environment, along with feedback and support. We would also like to thank our su- pervisor Björn Johnsson for proofreading this report and giving us feedback. iii iv Contents 1 Introduction 1 1.1 Goals ..................................... 1 1.2 Outline .................................... 2 1.3 Division of labor ............................... 3 2 Background 5 2.1 Team collaboration .............................
    [Show full text]