Live streaming of video and subtitles with MPEG-DASHCyril Concolato
This presentation was made at the MPEG meeting in Shanghai, China, in October 2012, related to the input contribution M26906. It gives the details about the demonstration made during the meeting. This demonstration showed the use of the Google Chrome browser to display synchronized video and subtitles, using the Media Source Extension draft specification and the WebVTT subtitle format. The video and DASH content was prepared using GPAC MP4Box tool.
Paris Video Tech - 1st Edition: Afrostream, un player agile pour suivre le m...Erica Beavers
Chez Afrostream nous avons testé une grande partie des players video du marché, je parlerai des problèmes rencontrés et comment se préparer a changer de techno rapidement
Paris Video Tech - 1st Edition: Streamroot, Adaptive Bitrate Algorithms: comm...Erica Beavers
Nous ferons une rapide explication des enjeux et mécanismes de l'Adaptive Bitrate Streaming, puis allons regarder les implémentations pratiques dans les media engines de référence dash.js et hls.js.
Live streaming of video and subtitles with MPEG-DASHCyril Concolato
This presentation was made at the MPEG meeting in Shanghai, China, in October 2012, related to the input contribution M26906. It gives the details about the demonstration made during the meeting. This demonstration showed the use of the Google Chrome browser to display synchronized video and subtitles, using the Media Source Extension draft specification and the WebVTT subtitle format. The video and DASH content was prepared using GPAC MP4Box tool.
Paris Video Tech - 1st Edition: Afrostream, un player agile pour suivre le m...Erica Beavers
Chez Afrostream nous avons testé une grande partie des players video du marché, je parlerai des problèmes rencontrés et comment se préparer a changer de techno rapidement
Paris Video Tech - 1st Edition: Streamroot, Adaptive Bitrate Algorithms: comm...Erica Beavers
Nous ferons une rapide explication des enjeux et mécanismes de l'Adaptive Bitrate Streaming, puis allons regarder les implémentations pratiques dans les media engines de référence dash.js et hls.js.
As eBay is moving to OpenStack, we need to find capacity conversion ratio between ESX and KVM. Moreover, we hope to tunning KVM performance that make KVM to be same as or better than ESX
Introducing Container Technology to TSUBAME3.0 SupercomputerAkihiro Nomura
Invited Talk in ISC High Performance 2019 Focus Session "Containers for Acceleration and Accessibility in HPC and Cloud Ecosystems" https://2019.isc-program.com/presentation/?id=inv_sp183&sess=sess177
GStreamer-VAAPI: Hardware-accelerated encoding and decoding on Intel hardware...Igalia
By Víctor M. Jáquez.
Slides at https://github.com/01org/gstreamer-vaapi/tree/master/docs/slides/gstconf2015
GStreamer-VAAPI is a set of GStreamer elements (vaapidecode, vaapipostroc, vaapisink, and several encoders) and libgstvapi, a library that wraps libva under a GObject/GStreamer semantics.
This talk will be about VAAPI and its integration with GStreamer. We will show a general overview of VAAPI architecture, the role of libgstvaapi, and finally, the design of GStreamer elements. Afterwards we will show what is ahead in the development of GStreamer-VAAPI, and the current problems and challenges.
HTTP/2 and QUICK protocols. Optimizing the Web stack for HTTP/2 erapeychevi
The new HTTP/2 protocol which is going to replace HTTP 1.1 was finished on February. Together with it, QUIC is being developed rapidly. Discover why are they so important for the Web and how will they influence the way we optimize the Web stack for the HTTP/2 era.
Streaming in HTML5 will introduce you to the world of DASH streaming through HTML5 capable Browser. We'll go through the concepts of streaming, adaptive streaming, DASH protocol, MP4 encapsulation of H.264. Our showcase will use HTML5 MSE API to fetch, process and render H.264 video provided by the United Cloud platform.
As eBay is moving to OpenStack, we need to find capacity conversion ratio between ESX and KVM. Moreover, we hope to tunning KVM performance that make KVM to be same as or better than ESX
Introducing Container Technology to TSUBAME3.0 SupercomputerAkihiro Nomura
Invited Talk in ISC High Performance 2019 Focus Session "Containers for Acceleration and Accessibility in HPC and Cloud Ecosystems" https://2019.isc-program.com/presentation/?id=inv_sp183&sess=sess177
GStreamer-VAAPI: Hardware-accelerated encoding and decoding on Intel hardware...Igalia
By Víctor M. Jáquez.
Slides at https://github.com/01org/gstreamer-vaapi/tree/master/docs/slides/gstconf2015
GStreamer-VAAPI is a set of GStreamer elements (vaapidecode, vaapipostroc, vaapisink, and several encoders) and libgstvapi, a library that wraps libva under a GObject/GStreamer semantics.
This talk will be about VAAPI and its integration with GStreamer. We will show a general overview of VAAPI architecture, the role of libgstvaapi, and finally, the design of GStreamer elements. Afterwards we will show what is ahead in the development of GStreamer-VAAPI, and the current problems and challenges.
HTTP/2 and QUICK protocols. Optimizing the Web stack for HTTP/2 erapeychevi
The new HTTP/2 protocol which is going to replace HTTP 1.1 was finished on February. Together with it, QUIC is being developed rapidly. Discover why are they so important for the Web and how will they influence the way we optimize the Web stack for the HTTP/2 era.
Streaming in HTML5 will introduce you to the world of DASH streaming through HTML5 capable Browser. We'll go through the concepts of streaming, adaptive streaming, DASH protocol, MP4 encapsulation of H.264. Our showcase will use HTML5 MSE API to fetch, process and render H.264 video provided by the United Cloud platform.
Anatomy of a web app
HTML5
CSS3
This presentation has been developed in the context of the Mobile Applications Development course, DISIM, University of L'Aquila (Italy), Spring 2016.
http://www.ivanomalavolta.com
An overview of DojoX GFX and DojoX Drawing, and the underlying technology that uses SVG and VML to provide vector-based graphics cross-browser without the use of Flash.
In this lecture, I provide an overview of what it takes to create amazing Web Apps : rich media, the Canvas API, local storage and offline persistence are covered.
Anatomy of a web app
HTML5
CSS3
This presentation has been developed in the context of the Mobile Applications Development course, DISIM, University of L'Aquila (Italy), Spring 2015.
http://www.ivanomalavolta.com
Tutoriel sur le streaming vidéo sur HTTP et sur MPEG-DASHCyril Concolato
Présentation donnée lors de la réunion du 1/10/2013 au GDR-ISIS, présentant les concepts de streaming vidéo sur HTTP, la norme MPEG-DASH et les outils Open Source permettant de manipuler du contenu DASH.
Presentation of the research activities of the GPAC team of Telecom ParisTech during the plenary session of the "Réseau Thématique 4" of the Mines-Telecom Institute
Extensions for Hybrid Delivery using MPEG-2 TS and DASHCyril Concolato
Slides presented during the 102nd MPEG meeting, October 2012, presenting some ideas for the hybrid delivery (DASH over IP/ MPEG-2 TS over non-IP networks) of multimedia content.
Adaptive Video and Metadata Display using Multimedia DocumentsCyril Concolato
Presentation of the paper "Adaptive Video and Metadata Display using Multimedia Documents" during International Workshop on Social, Adaptive and Personalized Multimedia Interaction and Access, Florence, Italy, October 2010
This presentation was given during the ACM MMSys 2011 Conference. The presentation is about the usage of Dynamic Adaptive Streaming over HTTP for Rich Media and Interactive services.
A tale of scale & speed: How the US Navy is enabling software delivery from l...sonjaschweigert1
Rapid and secure feature delivery is a goal across every application team and every branch of the DoD. The Navy’s DevSecOps platform, Party Barge, has achieved:
- Reduction in onboarding time from 5 weeks to 1 day
- Improved developer experience and productivity through actionable findings and reduction of false positives
- Maintenance of superior security standards and inherent policy enforcement with Authorization to Operate (ATO)
Development teams can ship efficiently and ensure applications are cyber ready for Navy Authorizing Officials (AOs). In this webinar, Sigma Defense and Anchore will give attendees a look behind the scenes and demo secure pipeline automation and security artifacts that speed up application ATO and time to production.
We will cover:
- How to remove silos in DevSecOps
- How to build efficient development pipeline roles and component templates
- How to deliver security artifacts that matter for ATO’s (SBOMs, vulnerability reports, and policy evidence)
- How to streamline operations with automated policy checks on container images
Epistemic Interaction - tuning interfaces to provide information for AI supportAlan Dix
Paper presented at SYNERGY workshop at AVI 2024, Genoa, Italy. 3rd June 2024
https://alandix.com/academic/papers/synergy2024-epistemic/
As machine learning integrates deeper into human-computer interactions, the concept of epistemic interaction emerges, aiming to refine these interactions to enhance system adaptability. This approach encourages minor, intentional adjustments in user behaviour to enrich the data available for system learning. This paper introduces epistemic interaction within the context of human-system communication, illustrating how deliberate interaction design can improve system understanding and adaptation. Through concrete examples, we demonstrate the potential of epistemic interaction to significantly advance human-computer interaction by leveraging intuitive human communication strategies to inform system design and functionality, offering a novel pathway for enriching user-system engagements.
Removing Uninteresting Bytes in Software FuzzingAftab Hussain
Imagine a world where software fuzzing, the process of mutating bytes in test seeds to uncover hidden and erroneous program behaviors, becomes faster and more effective. A lot depends on the initial seeds, which can significantly dictate the trajectory of a fuzzing campaign, particularly in terms of how long it takes to uncover interesting behaviour in your code. We introduce DIAR, a technique designed to speedup fuzzing campaigns by pinpointing and eliminating those uninteresting bytes in the seeds. Picture this: instead of wasting valuable resources on meaningless mutations in large, bloated seeds, DIAR removes the unnecessary bytes, streamlining the entire process.
In this work, we equipped AFL, a popular fuzzer, with DIAR and examined two critical Linux libraries -- Libxml's xmllint, a tool for parsing xml documents, and Binutil's readelf, an essential debugging and security analysis command-line tool used to display detailed information about ELF (Executable and Linkable Format). Our preliminary results show that AFL+DIAR does not only discover new paths more quickly but also achieves higher coverage overall. This work thus showcases how starting with lean and optimized seeds can lead to faster, more comprehensive fuzzing campaigns -- and DIAR helps you find such seeds.
- These are slides of the talk given at IEEE International Conference on Software Testing Verification and Validation Workshop, ICSTW 2022.
DevOps and Testing slides at DASA ConnectKari Kakkonen
My and Rik Marselis slides at 30.5.2024 DASA Connect conference. We discuss about what is testing, then what is agile testing and finally what is Testing in DevOps. Finally we had lovely workshop with the participants trying to find out different ways to think about quality and testing in different parts of the DevOps infinity loop.
zkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex ProofsAlex Pruden
This paper presents Reef, a system for generating publicly verifiable succinct non-interactive zero-knowledge proofs that a committed document matches or does not match a regular expression. We describe applications such as proving the strength of passwords, the provenance of email despite redactions, the validity of oblivious DNS queries, and the existence of mutations in DNA. Reef supports the Perl Compatible Regular Expression syntax, including wildcards, alternation, ranges, capture groups, Kleene star, negations, and lookarounds. Reef introduces a new type of automata, Skipping Alternating Finite Automata (SAFA), that skips irrelevant parts of a document when producing proofs without undermining soundness, and instantiates SAFA with a lookup argument. Our experimental evaluation confirms that Reef can generate proofs for documents with 32M characters; the proofs are small and cheap to verify (under a second).
Paper: https://eprint.iacr.org/2023/1886
GraphRAG is All You need? LLM & Knowledge GraphGuy Korland
Guy Korland, CEO and Co-founder of FalkorDB, will review two articles on the integration of language models with knowledge graphs.
1. Unifying Large Language Models and Knowledge Graphs: A Roadmap.
https://arxiv.org/abs/2306.08302
2. Microsoft Research's GraphRAG paper and a review paper on various uses of knowledge graphs:
https://www.microsoft.com/en-us/research/blog/graphrag-unlocking-llm-discovery-on-narrative-private-data/
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024Albert Hoitingh
In this session I delve into the encryption technology used in Microsoft 365 and Microsoft Purview. Including the concepts of Customer Key and Double Key Encryption.
Accelerate your Kubernetes clusters with Varnish CachingThijs Feryn
A presentation about the usage and availability of Varnish on Kubernetes. This talk explores the capabilities of Varnish caching and shows how to use the Varnish Helm chart to deploy it to Kubernetes.
This presentation was delivered at K8SUG Singapore. See https://feryn.eu/presentations/accelerate-your-kubernetes-clusters-with-varnish-caching-k8sug-singapore-28-2024 for more details.
Transcript: Selling digital books in 2024: Insights from industry leaders - T...BookNet Canada
The publishing industry has been selling digital audiobooks and ebooks for over a decade and has found its groove. What’s changed? What has stayed the same? Where do we go from here? Join a group of leading sales peers from across the industry for a conversation about the lessons learned since the popularization of digital books, best practices, digital book supply chain management, and more.
Link to video recording: https://bnctechforum.ca/sessions/selling-digital-books-in-2024-insights-from-industry-leaders/
Presented by BookNet Canada on May 28, 2024, with support from the Department of Canadian Heritage.
Elevating Tactical DDD Patterns Through Object CalisthenicsDorra BARTAGUIZ
After immersing yourself in the blue book and its red counterpart, attending DDD-focused conferences, and applying tactical patterns, you're left with a crucial question: How do I ensure my design is effective? Tactical patterns within Domain-Driven Design (DDD) serve as guiding principles for creating clear and manageable domain models. However, achieving success with these patterns requires additional guidance. Interestingly, we've observed that a set of constraints initially designed for training purposes remarkably aligns with effective pattern implementation, offering a more ‘mechanical’ approach. Let's explore together how Object Calisthenics can elevate the design of your tactical DDD patterns, offering concrete help for those venturing into DDD for the first time!
Enhancing Performance with Globus and the Science DMZGlobus
ESnet has led the way in helping national facilities—and many other institutions in the research community—configure Science DMZs and troubleshoot network issues to maximize data transfer performance. In this talk we will present a summary of approaches and tips for getting the most out of your network infrastructure using Globus Connect Server.
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...James Anderson
Effective Application Security in Software Delivery lifecycle using Deployment Firewall and DBOM
The modern software delivery process (or the CI/CD process) includes many tools, distributed teams, open-source code, and cloud platforms. Constant focus on speed to release software to market, along with the traditional slow and manual security checks has caused gaps in continuous security as an important piece in the software supply chain. Today organizations feel more susceptible to external and internal cyber threats due to the vast attack surface in their applications supply chain and the lack of end-to-end governance and risk management.
The software team must secure its software delivery process to avoid vulnerability and security breaches. This needs to be achieved with existing tool chains and without extensive rework of the delivery processes. This talk will present strategies and techniques for providing visibility into the true risk of the existing vulnerabilities, preventing the introduction of security issues in the software, resolving vulnerabilities in production environments quickly, and capturing the deployment bill of materials (DBOM).
Speakers:
Bob Boule
Robert Boule is a technology enthusiast with PASSION for technology and making things work along with a knack for helping others understand how things work. He comes with around 20 years of solution engineering experience in application security, software continuous delivery, and SaaS platforms. He is known for his dynamic presentations in CI/CD and application security integrated in software delivery lifecycle.
Gopinath Rebala
Gopinath Rebala is the CTO of OpsMx, where he has overall responsibility for the machine learning and data processing architectures for Secure Software Delivery. Gopi also has a strong connection with our customers, leading design and architecture for strategic implementations. Gopi is a frequent speaker and well-known leader in continuous delivery and integrating security into software delivery.
Alt. GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using ...James Anderson
Effective Application Security in Software Delivery lifecycle using Deployment Firewall and DBOM
The modern software delivery process (or the CI/CD process) includes many tools, distributed teams, open-source code, and cloud platforms. Constant focus on speed to release software to market, along with the traditional slow and manual security checks has caused gaps in continuous security as an important piece in the software supply chain. Today organizations feel more susceptible to external and internal cyber threats due to the vast attack surface in their applications supply chain and the lack of end-to-end governance and risk management.
The software team must secure its software delivery process to avoid vulnerability and security breaches. This needs to be achieved with existing tool chains and without extensive rework of the delivery processes. This talk will present strategies and techniques for providing visibility into the true risk of the existing vulnerabilities, preventing the introduction of security issues in the software, resolving vulnerabilities in production environments quickly, and capturing the deployment bill of materials (DBOM).
Speakers:
Bob Boule
Robert Boule is a technology enthusiast with PASSION for technology and making things work along with a knack for helping others understand how things work. He comes with around 20 years of solution engineering experience in application security, software continuous delivery, and SaaS platforms. He is known for his dynamic presentations in CI/CD and application security integrated in software delivery lifecycle.
Gopinath Rebala
Gopinath Rebala is the CTO of OpsMx, where he has overall responsibility for the machine learning and data processing architectures for Secure Software Delivery. Gopi also has a strong connection with our customers, leading design and architecture for strategic implementations. Gopi is a frequent speaker and well-known leader in continuous delivery and integrating security into software delivery.
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...UiPathCommunity
💥 Speed, accuracy, and scaling – discover the superpowers of GenAI in action with UiPath Document Understanding and Communications Mining™:
See how to accelerate model training and optimize model performance with active learning
Learn about the latest enhancements to out-of-the-box document processing – with little to no training required
Get an exclusive demo of the new family of UiPath LLMs – GenAI models specialized for processing different types of documents and messages
This is a hands-on session specifically designed for automation developers and AI enthusiasts seeking to enhance their knowledge in leveraging the latest intelligent document processing capabilities offered by UiPath.
Speakers:
👨🏫 Andras Palfi, Senior Product Manager, UiPath
👩🏫 Lenka Dulovicova, Product Program Manager, UiPath
Welcome to the first live UiPath Community Day Dubai! Join us for this unique occasion to meet our local and global UiPath Community and leaders. You will get a full view of the MEA region's automation landscape and the AI Powered automation technology capabilities of UiPath. Also, hosted by our local partners Marc Ellis, you will enjoy a half-day packed with industry insights and automation peers networking.
📕 Curious on our agenda? Wait no more!
10:00 Welcome note - UiPath Community in Dubai
Lovely Sinha, UiPath Community Chapter Leader, UiPath MVPx3, Hyper-automation Consultant, First Abu Dhabi Bank
10:20 A UiPath cross-region MEA overview
Ashraf El Zarka, VP and Managing Director MEA, UiPath
10:35: Customer Success Journey
Deepthi Deepak, Head of Intelligent Automation CoE, First Abu Dhabi Bank
11:15 The UiPath approach to GenAI with our three principles: improve accuracy, supercharge productivity, and automate more
Boris Krumrey, Global VP, Automation Innovation, UiPath
12:15 To discover how Marc Ellis leverages tech-driven solutions in recruitment and managed services.
Brendan Lingam, Director of Sales and Business Development, Marc Ellis
Securing your Kubernetes cluster_ a step-by-step guide to success !KatiaHIMEUR1
Today, after several years of existence, an extremely active community and an ultra-dynamic ecosystem, Kubernetes has established itself as the de facto standard in container orchestration. Thanks to a wide range of managed services, it has never been so easy to set up a ready-to-use Kubernetes cluster.
However, this ease of use means that the subject of security in Kubernetes is often left for later, or even neglected. This exposes companies to significant risks.
In this talk, I'll show you step-by-step how to secure your Kubernetes cluster for greater peace of mind and reliability.
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdfPeter Spielvogel
Building better applications for business users with SAP Fiori.
• What is SAP Fiori and why it matters to you
• How a better user experience drives measurable business benefits
• How to get started with SAP Fiori today
• How SAP Fiori elements accelerates application development
• How SAP Build Code includes SAP Fiori tools and other generative artificial intelligence capabilities
• How SAP Fiori paves the way for using AI in SAP apps
2. Context and Motivations
Animating using web technologies is getting popular
• Lots of content being produced
« SVG 2 » and « Web Animations 1.0 » being drafted
• Opportunities to improve the technologies
My goal: Enable treating web animations like video
• Why?
• What kind of animations?
• How?
2
23/10/2013
Cyril Concolato
Streaming SVG animations on the Web
3. Web Animation Use Cases
Animations in User Interfaces
Animations for Data Visualization
Timeline-based Animations
•
•
•
Graphics animations (cartoons, …)
Synchronized audio & graphics (karaoke, ads …)
Synchronized video & graphics (annotations, subtitles)
Popcorn.js
3
23/10/2013
SVG Wow!
Cyril Concolato
Cartoon
Streaming SVG animations on the Web
4. Timeline-based Animations Possibilities
Playback control using a clock
• Play(0)/Play(T)
• Pause/Resume
• Speed-up/slow down
Accurate synchronization
• Between animations or
between animation and media
• Dependent clocks and timestamps
Similar to video
but not allowed in HTML5 <video>
4
23/10/2013
Cyril Concolato
Streaming SVG animations on the Web
5. An SVG video-like JavaScript Player
Principles
Using HTML 5 <video> syntax but for SVG
content
Demo 1
1
2
3
<video controls width="640" height="480">
<source src="myAnimatedFile.svg" type="image/svg+xml" >
</video>
Demo 2
1
2
3
4
<video controls width="640" height="480">
<source src="file.mp4" type="video/mp4" >
<track src="annotations.svg" kind="graphics" type="image/svg+xml">
</video>
5
23/10/2013
Cyril Concolato
Streaming SVG animations on the Web
6. An SVG video-like JavaScript Player
Status
Simple Implementation
•
•
•
•
GUI based on Video.js
Replacing <video> by <svg> at run-time
Using XHR to fetch SVG data and insert in the page
Uses get/setCurrentTime() and un/pauseAnimations()
Limitations
•
•
•
•
6
23/10/2013
Bugs!
Same origin restrictions
Incremental/progressive loading not working
Cannot reproduce HTML network-related events (can
play, can play through)
Cyril Concolato
Streaming SVG animations on the Web
7. An SVG video-like JavaScript player:
Next Step
Network-aware Controlled Playback
•
Load SVG data just before it’s needed (and let garbage collection
do the rest)
How to achieve controlled playback of SVG ?
•
7
23/10/2013
Apply streaming concepts
Cyril Concolato
Streaming SVG animations on the Web
8. Applying streaming concepts to SVG
Streaming
“Controlled continuous delivery and consumption of data units”
What’s needed to stream SVG content?
•
Fragmentation of SVG documents into streaming units
─ Needs guidelines for SVG authoring
•
Assign timing to each unit
─ Mapping between byte-offset/time-position of the SVG document
─ Needs a streaming instruction format
•
Seek information
─ Needs explicit processing behavior
SVG Streaming draft
•
•
http://dev.w3.org/SVG/modules/streaming/
Feedback welcome
Example: Streaming SVG Cartoons
8
23/10/2013
Cyril Concolato
Streaming SVG animations on the Web
9. Cartoons on the Web – Today
Source: www.cartoonnetwork.com
Largely based on Vector Graphics
•
•
Bezier curves filled with solid color or simple gradients and/or stroke
Sometimes using raster images (e.g. background or texture)
Mostly frame-based content
•
•
•
Sometimes with additional interpolation
Typically synchronized with a sound track
Good candidate for streaming
Currently delivered as Flash or video streams
•
9
23/10/2013
Plugins, coding artefacts or bandwidth problems …
Cyril Concolato
Streaming SVG animations on the Web
10. Cartoons on the Web – Next Steps
Could be better integrated in the web platform
•
Using of vector graphics primitives for scalability and new
primitives for advanced rendering
─ E.g. coons patches, hatches (SVG 2), diffusion curves, …
•
Using other web technologies
─ Styling, language translation, …
Attempts to convert Flash to HTML5/CSS/SVG/Canvas
•
Many JS-based approaches
─
─
─
─
•
Google Swiffy
Mozilla Shumway
Adobe CreateJS
PixelPlant
Some declarative approaches
─ MP4Box (100% SVG)
10
23/10/2013
Cyril Concolato
Streaming SVG animations on the Web
12. Fragmentation of SVG document
into streaming units
Identify stream header
•
•
Static throughout the streaming session
Required to initialize the parser
Make sure SVG data is properly ordered
•
•
Use only backward references
Document order == time order
Identify units
•
•
Assign timestamps
No overlap in position / possible overlap in time (like WebVTT cues)
Make self-discardable units
•
<discard>, JavaScript, scoped stylesheets
Mark self-contained units
•
12
23/10/2013
Random Access Point
Cyril Concolato
Streaming SVG animations on the Web
14. How to generate Streaming Instructions ?
Post-authoring
• Requires byte positions to be final
Hard to determine without author’s instructions
• Where does the frame start/end?
• What’s the timestamp of the unit?
• Where are the random access points?
Possible automatic generation from Flash
Possible with additional elements/attributes
14
23/10/2013
Cyril Concolato
Streaming SVG animations on the Web
16. Generating Streaming Instructions
for SVG content converted from Flash
MP4Box -add flash.swf:fmt=svg file_with_svg_track.mp4
MP4Box -info file_with_svg_track.mp4
MP4Box -six 1 file_with_svg_track.mp4
16
23/10/2013
Cyril Concolato
Streaming SVG animations on the Web
17. SVG Streaming Demo
SVG
+
Streaming
Instructions
Demo 3
•
•
•
•
•
Web Server
(byte-range support)
Browser
+
JS Player
Playing an SVG stream
Viewing Random Access Points and others
Seeking into an SVG unit not yet downloaded
Concatenating SVG content (splicing)
Live and pseudo-live streaming of SVG content
─ Web-based Vector Graphics TV channel
17
23/10/2013
Cyril Concolato
Streaming SVG animations on the Web
18. SVG streams and Media Containers
MP4
Flash
MP4
SVG
MP4Box
Video
SVG
Audio
Why? What for?
•
Packaging audio/video/graphics together
─ To download only one resource
─ To facilitate synchronization of tracks
•
Possible use with HTML5 native <video> elements
─ SVG in-band graphical track
•
Possible use with HTML 5 Media Source extensions
─ Adaptive streaming of SVG
Formats
•
•
18
23/10/2013
ISO/IEC-14496:12 (royalty-free) defines how to store
timed text in MP4
Could be done for other formats (WebM, Ogg, …)
Cyril Concolato
Streaming SVG animations on the Web
19. SVG streams and WebVTT
WebVTT allows metadata tracks and raw cues
1
2
3
4
<video controls width="640" height="480">
<source src="file.mp4" type="video/mp4" >
<track src="annotations.vtt" kind="metadata">
</video>
SVG
WebVTT
Flash
WebVTT
SVG
MP4Box
MP4Box –webvtt-raw 1 file_with_svg.mp4
MP4Box –webvtt-raw 1:embedded file_with_svg.mp4
19
23/10/2013
Cyril Concolato
Streaming SVG animations on the Web
21. SVG referenced in WebVTT
WEBVTT Metadata track generated by GPAC MP4Box
kind: metadata
inBandMetadataTrackDispatchType: image/svg+xml
baseMediaFile: flash7.svg
text-header-length: 207
00:00:00.000 --> 00:00:00.083 mediaOffset:207 dataLength:311 isRAP:true
00:00:00.083 --> 00:00:00.166 mediaOffset:518 dataLength:320 isRAP:false
00:00:00.166 --> 00:00:00.250 mediaOffset:838 dataLength:207 isRAP:false
...
21
23/10/2013
Cyril Concolato
Streaming SVG animations on the Web
22. Summary & Conclusion
Presented
•
•
Guidelines for authoring streamable SVG content
Tools for generating streaming instructions
─ from Flash, will be extended to support SVG natively
•
JavaScript-based players for streamable SVG content
Outcome
•
Provided that your SVG content is well structured and annotated,
you can stream SVG content
─ In different modes: Controlled Progressive Download, Live, On Demand,
Playlists, Adaptive, …
─ Out of band graphics tracks (currently with JS shim)
─ In band tracks in media containers (in browsers in the future)
Future work
•
•
•
22
23/10/2013
Implement adaptive streaming (MP4 based)
Implement media synchronization (WebVTT)
Work with CSS-based or JS-based animations
Cyril Concolato
Streaming SVG animations on the Web
24. Further reading
SVG Related
• HTML 5 Video and SVG Graphics Synchronization
• Carriage of SVG and WebVTT in MP4 (Blog, Text
Track CG)
Streaming related
• Live streaming over HTTP of video and subtitles (Part
1 & Part 2)
• WebVTT streaming
24
23/10/2013
Cyril Concolato
Streaming SVG animations on the Web