WebVTT - MDN Web Docs Glossary: Definitions of Web-related terms
webvtt (web video text tracks) is a w3c specification for a file format marking up text track resources in combination with the html <track> element.
... webvtt files provide metadata that is time-aligned with audio or video content like captions or subtitles for video content, text video descriptions, chapters for content navigation, and more.
... learn more general knowledge webvtt on wikipedia technical reference webvtt on mdn specification ...

Web performance - MDN Web Docs Glossary: Definitions of Web-related terms
web performance is the objective time from when a request for content is made until the requested content is displayed in the user's browser, objective render times, and the subjective user experience of load time and runtime.
... objectively, it is measurable time, in milliseconds, it takes for the web page or web application to be downloaded, painted in the user's web browser, and become responsive and interactive.
... learn more learn about web performance perceived performance ...

Responsive web design - MDN Web Docs Glossary: Definitions of Web-related terms
responsive web design (rwd) is a web development concept focusing on making sites look and behave optimally on all personal computing devices, from desktop to mobile.
... learn more general knowledge summary and resources pros and cons of going responsive responsive web design ...

WebAssembly - MDN Web Docs Glossary: Definitions of Web-related terms
webassembly (abbr.
... wasm) is an open binary programming format that can be run in modern web browsers in order to gain performance and/or provide new features for web pages.

WebM - MDN Web Docs Glossary: Definitions of Web-related terms
webm is royalty-free and is an open web video format natively supported in mozilla firefox.
... learn more general knowledge webm on wikipedia ...

WebP - MDN Web Docs Glossary: Definitions of Web-related terms
webp is a lossless and lossy compression image format developed by google.
... learn more general knowledge webp on wikipedia ...

Modern web apps - MDN Web Docs Glossary: Definitions of Web-related terms
see progressive web apps ...

WebExtensions - MDN Web Docs Glossary: Definitions of Web-related terms
webextensions is a cross-browser system for developing browser extensions in firefox.

Web server - MDN Web Docs Glossary: Definitions of Web-related terms
a web server is a piece of software that often runs on a hardware server offering service to a user, usually referred to as the client.

Index - MDN Web Docs Glossary: Definitions of Web-related terms
found 528 pages: # page tags and summary 1 mdn web docs glossary: definitions of web-related terms beginner, definitions, dictionary, glossary, index, landing, terminology web technologies contain long lists of jargon and abbreviations that are used in documentation and coding.
... this glossary provides definitions of words and abbreviations you need to know to successfully understand and build for the web.
...since 2007, utf-8 superseded it on the web.
...And 211 more matches

WebGLRenderingContext - Web APIs
the webglrenderingcontext interface provides an interface to the opengl es 2.0 graphics rendering context for the drawing surface of an html <canvas> element.
... to get an access to a webgl context for 2d and/or 3d graphics rendering, call getcontext() on a <canvas> element, supplying "webgl" as the argument: var canvas = document.getelementbyid('mycanvas'); var gl = canvas.getcontext('webgl'); once you have the webgl rendering context for a canvas, you can render within it.
... the webgl tutorial has more information, examples, and resources on how to get started with webgl.
...And 126 more matches

WebGL2RenderingContext - Web APIs
the webgl2renderingcontext interface provides the opengl es 3.0 rendering context for the drawing surface of an html <canvas> element.
... to get an object of this interface, call getcontext() on a <canvas> element, supplying "webgl2" as the argument: var canvas = document.getelementbyid('mycanvas'); var gl = canvas.getcontext('webgl2'); webgl 2 is an extension to webgl 1.
... the webgl2renderingcontext interface implements all members of the webglrenderingcontext interface.
...And 77 more matches

Server-side web frameworks - Learn web development
previous overview: first steps next the previous article showed you what the communication between web clients and servers looks like, the nature of http requests and responses, and what a server-side web application needs to do in order to respond to requests from a web browser.
... with this knowledge under our belt, it's time to explore how web frameworks can simplify these tasks, and give you an idea of how you'd choose a framework for your first server-side web application.
... objective: to understand how web frameworks can simplify development/maintenance of server-side code and to get readers thinking about selecting a framework for their own development.
...And 68 more matches

Understanding WebAssembly text format - WebAssembly
to enable webassembly to be read and edited by humans, there is a textual representation of the wasm binary format.
... note: this is potentially overkill if you are a web developer who just wants to load a wasm module into a page and use it in your code (see using the webassembly javascript api), but it is more useful if for example, you want to write wasm modules to optimize the performance of your javascript library, or build your own webassembly compiler.
... s-expressions in both the binary and textual formats, the fundamental unit of code in webassembly is a module.
...And 54 more matches

WebAssembly Concepts - WebAssembly
this article explains the concepts behind how webassembly works including its goals, the problems it solves, and how it runs inside the web browser's rendering engine.
... what is webassembly?
... webassembly is a new type of code that can be run in modern web browsers and provides new features and major gains in performance.
...And 50 more matches

Codecs used by WebRTC - Web media technologies
the webrtc api makes it possible to construct web sites and apps that let users communicate in real time, using audio and/or video as well as optional data and other information.
...this guide reviews the codecs that browsers are required to implement as well as other codecs that some or all browsers support for webrtc.
... containerless media webrtc uses bare mediastreamtrack objects for each track being shared from one peer to another, without a container or even a mediastream associated with the tracks.
...And 47 more matches

Starting up and shutting down a WebXR session - Web APIs
assuming you're already familiar with 3d graphics in general and webgl in particular, taking that next bold step into mixed reality—the idea of presenting artificial scenery or objects in addition to or in place of the real world—is not overly complicated.
... before you can begin to render your augmented or virtual reality scenario, you need to create and set up the webxr session, and you should know how to shut it down properly as well.
... accessing the webxr api your app's access to the webxr api begins with the xrsystem object.
...And 44 more matches

WebGL constants - Web APIs
the webgl api provides several constants that are passed into or returned by functions.
... standard webgl constants are installed on the webglrenderingcontext and webgl2renderingcontext objects, so that you use them as gl.constant_name: var canvas = document.getelementbyid('mycanvas'); var gl = canvas.getcontext('webgl'); gl.getparameter(gl.line_width); some constants are also provided by webgl extensions.
... var debuginfo = gl.getextension('webgl_debug_renderer_info'); var vendor = gl.getparameter(debuginfo.unmasked_vendor_webgl); the webgl tutorial has more information, examples, and resources on how to get started with webgl.
...And 42 more matches

Movement, orientation, and motion: A WebXR example - Web APIs
in this article, we'll make use of information introduced in the previous articles in our webxr tutorial series to construct an example which animates a rotating cube around which the user can move freely using a vr headset, keyboard, and/or mouse.
... screenshot of this example in action the core of this example—the spinning, textured, lighted cube—is taken from our webgl tutorial series; namely, the penultimate article in the series, covering lighting in webgl.
... when rendering the left eye, the xrwebgllayer has its viewport configured to restrict drawing to the left half of the drawing surface.
...And 42 more matches

Web video codec guide - Web media technologies
this guide introduces the video codecs you're most likely to encounter or consider using on the web, summaries of their capabilities and any compatibility and utility concerns, and advice to help you choose the right codec for your project's video.
... common codecs the following video codecs are those which are most commonly used on the web.
... codec name (short) full codec name container support av1 aomedia video 1 mp4, webm avc (h.264) advanced video coding 3gp, mp4, webm h.263 h.263 video 3gp hevc (h.265) high efficiency video coding mp4 mp4v-es mpeg-4 video elemental stream 3gp, mp4 mpeg-1 mpeg-1 part 2 visual mpeg, quicktime mpeg-2 mpeg-2 part 2 visual mp4, mpeg, quicktime theora theora ogg vp8 video processor 8 3gp...
...And 42 more matches

Introduction to progressive web apps - Progressive web apps (PWAs)
overview: progressive web apps next this article provides an introduction to progressive web apps (pwas), discussing what they are and the advantages they offer over regular web apps.
... what is a progressive web app?
... the term "progressive web app" isn't a formal or official name.
...And 40 more matches

Writing WebSocket servers - Web APIs
a websocket server is nothing more than an application listening on any port of a tcp server that follows a specific protocol.
... the task of creating a custom server tends to scare people; however, it can be straightforward to implement a simple websocket server on your platform of choice.
... a websocket server can be written in any server-side programming language that is capable of berkeley sockets, such as c(++), python, php, or server-side javascript.
...And 39 more matches

WebXR Device API - Web APIs
webxr is a group of standards which are used together to support rendering 3d scenes to hardware designed for presenting virtual worlds (virtual reality, or vr), or for adding graphical imagery to the real world, (augmented reality, or ar).
... the webxr device api implements the core of the webxr feature set, managing the selection of output devices, render the 3d scene to the chosen device at the appropriate frame rate, and manage motion vectors created using input controllers.
... webxr-compatible devices include fully-immersive 3d headsets with motion and orientation tracking, eyeglasses which overlay graphics atop the real world scene passing through the frames, and handheld mobile phones which augment reality by capturing the world with a camera and augment that scene with computer-generated imagery.
...And 38 more matches

Using the WebAssembly JavaScript API - WebAssembly
if you have already compiled a module from another language using tools like emscripten, or loaded and run the code yourself, the next step is to learn more about using the other features of the webassembly javascript api.
... note: if you are unfamiliar with the basic concepts mentioned in this article and need more explanation, read webassembly concepts first, then come back.
... some simple examples let’s run through some examples that explain how to use the webassembly javascript api, and how to use it to load a wasm module in a web page.
...And 37 more matches

WebGL best practices - Web APIs
webgl is a complicated api, and it's often not obvious what the recommended ways to use it are.
... general topics address and eliminate webgl errors your application should run without generating any webgl errors (as returned by geterror).
... every webgl error is reported in the web console as a javascript warning with a descriptive message.
...And 36 more matches

Introduction to web APIs - Learn web development
overview: client-side web apis next first up, we'll start by looking at apis from a high level — what are they, how do they work, how to use them in your code, and how are they structured?
...they generally fall into two categories: browser apis are built into your web browser and are able to expose data from the browser and surrounding computer environment and do useful complex things with it.
... for example, the web audio api provides javascript constructs for manipulating audio in the browser — taking an audio track, altering its volume, applying effects to it, etc.
...And 35 more matches

What is a web server? - Learn web development
in this article, we explain what web servers are, how web servers work, and why they are important.
... prerequisites: you should already know how the internet works, and understand the difference between a web page, a web site, a web server, and a search engine.
... objective: you will learn what a web server is and gain a general understanding of how it works.
...And 34 more matches

Website security - Learn web development
previous overview: first steps website security requires vigilance in all aspects of website design and usage.
... this introductory article won't make you a website security guru, but it will help you understand where threats come from, and what you can do to harden your web application against the most common attacks.
... objective: to understand the most common threats to web application security and what you can do to reduce the risk of your site being hacked.
...And 32 more matches

WebGLRenderingContext.getParameter() - Web APIs
the webglrenderingcontext.getparameter() method of the webgl api returns a value for the passed parameter name.
... parameter names webgl 1 you can query the following pname parameters when using a webglrenderingcontext.
... constant returned type description gl.active_texture glenum gl.aliased_line_width_range float32array (with 2 elements) gl.aliased_point_size_range float32array (with 2 elements) gl.alpha_bits glint gl.array_buffer_binding webglbuffer gl.blend glboolean gl.blend_color float32array (with 4 values) gl.blend_dst_alpha glenum gl.blend_dst_rgb glenum gl.blend_equation glenum gl.blend_equation_alpha glenum gl.blend_equation_rgb glenum gl.blend_src_alpha glenum gl.blend_src_rgb glenum gl.blue_bits glint gl.color_clear_value float32a...
...And 29 more matches

Viewpoints and viewers: Simulating cameras in WebXR - Web APIs
the first and most important thing to understand when considering the code to manage point-of-view and cameras in your application is this: webxr does not have cameras.
... there's no magic object provided by either the webgl or the webxr api that represents the viewer that you can simply rotate and move around to automatically change what's seen on the screen.
... in this guide we show how use webgl to simulate camera movements without having a camera to move.
...And 29 more matches

Fundamentals of WebXR - Web APIs
webxr, with the webxr device api at its core, provides the functionality needed to bring both augmented and virtual reality (ar and vr) to the web.
... in this guide, we provide a fundamental overview of what webxr is and how it works, as well as providing a foundation for what you'll need to know before you even begin to learn to develop augmented reality and virtual reality experiences for the web.
... what webxr is and isn't webxr is an api for web content and apps to use to interface with mixed reality hardware such as vr headsets and glasses with integrated augmented reality features.
...And 29 more matches

WebRTC API - Web APIs
webrtc (web real-time communication) is a technology which enables web applications and sites to capture and optionally stream audio and/or video media, as well as to exchange arbitrary data between browsers without requiring an intermediary.
... the set of standards that comprise webrtc makes it possible to share data and perform teleconferencing peer-to-peer, without requiring that the user installs plug-ins or any other third-party software.
... webrtc consists of several interrelated apis and protocols which work together to achieve this.
...And 27 more matches

Web fonts - Learn web development
in this article we will go further, exploring web fonts in detail — these allow you to download custom fonts along with your web page, to allow for more varied, custom text styling.
... objective: to learn how to apply web fonts to a web page, using either a third party service, or by writing your own code.
...this takes one or more font family names, and the browser travels down the list until it finds a font it has available on the system it is running on: p { font-family: helvetica, "trebuchet ms", verdana, sans-serif; } this system works well, but traditionally web developers' font choices were limited.
...And 25 more matches

Publishing your website - Learn web development
previous overview: getting started with the web next once you finish writing the code and organizing the files that make up your website, you need to put it all online so people can find it.
... publishing a website is a complex topic because there are many ways to go about it.
... getting hosting and a domain name to have more control over content and website appearance, most people choose to buy web hosting and a domain name: web hosting is rented file space on a hosting company's web server.
...And 24 more matches

Web Audio API - Web APIs
the web audio api provides a powerful and versatile system for controlling audio on the web, allowing developers to choose audio sources, add effects to audio, create audio visualizations, apply spatial effects (such as panning) and much more.
... web audio concepts and usage the web audio api involves handling audio operations inside an audio context, and has been designed to allow modular routing.
... audio nodes are linked into chains and simple webs by their inputs and outputs.
...And 24 more matches

Structural overview of progressive web apps - Progressive web apps (PWAs)
while progressive web apps (pwas) can do anything any web content can do, they need to have a particular structure and include specific components in order to be recognized as a web app that can be used both on the web and installed and run as a local application.
... in this structural overview, we'll look at the features that make up a standard web application, as well as some design patterns you can follow when building your pwa.
... architecture of an app there are two main, different approaches to rendering a website — on the server or on the client.
...And 24 more matches

How the Web works - Learn web development
previous overview: getting started with the web how the web works provides a simplified view of what happens when you view a webpage in a web browser on your computer or phone.
... this theory is not essential to writing web code in the short term, but before long you'll really start to benefit from understanding what's happening in the background.
... clients and servers computers connected to the web are called clients and servers.
...And 23 more matches

Geometry and reference spaces in WebXR - Web APIs
at a fundamental level, rendering of scenes for webxr presentation in either augmented reality or virtual reality contexts is performed using webgl, so the two apis share much of the same design language.
... however, in order to provide the ability to present scenes in true 3d using xr headsets and other such equipment, webxr has additional concepts that must be understood.
... in this article, we introduce the ways in which webxr expands upon the geometry of webgl, and how the positions and orientations of objects—both physical and virtual—are described in relation to one another using spaces and, in particular, reference spaces.
...And 23 more matches

Migrating from webkitAudioContext - Web APIs
the web audio api went through many iterations before reaching its current state.
... it was first implemented in webkit, and some of its older parts were not immediately removed as they were replaced in the specification, leading to many sites using non-compatible code.
... in this article, we cover the differences in web audio api since it was first implemented in webkit and how to update your code to use the modern web audio api.
...And 23 more matches

Progressive web app structure - Progressive web apps (PWAs)
previous overview: progressive web apps next now that we know the theory behind pwas, let's look at the recommended structure of an actual app.
... architecture of an app there are two main, different approaches to rendering a website — on the server or on the client.
... server-side rendering (ssr) means a website is rendered on the server, so it offers quicker first load, but navigating between pages requires downloading new html content.
...And 23 more matches

Web audio codec guide - Web media technologies
for web developers, an even bigger concern is the network bandwidth needed in order to transfer audio, whether for streaming or to download it for use during gameplay.
...in this article, we look at audio codecs used on the web to compress and decompress audio, what their capabilities and use cases are, and offer guidance when choosing audio codecs to use for your content.
... additionally, webrtc implementations generally use a subset of these codecs for their encoding and decoding of media, and may support additional codecs as well, for optimal cross-platform support of video and audio conferencing, and to integrate better with legacy telecommunication solutions.
...And 22 more matches

Rendering and the WebXR frame animation callback - Web APIs
once your webxr environment has been set up and an xrsession created to represent an ongoing xr environment session, you need to provide frames of the scene to the xr device for rendering.
... before you can render the virtual environment, you need to establish a webxr session by creating an xrsession using the navigator.xr.requestsession() method; you also need to associate the session with a framebuffer and perform other setup tasks.
... these setup tasks are described in the article setting up and shutting down a webxr session.
...And 21 more matches

Compiling from Rust to WebAssembly - WebAssembly
if you have some rust code, you can compile it into webassembly (wasm).
... this tutorial takes you through all you need to know to compile a rust project to wasm and use it in an existing web app.
... rust and webassembly use cases there are two main use cases for rust and webassembly: to build an entire application — an entire web app based in rust.
...And 21 more matches

Using the Web Audio API - Web APIs
let's take a look at getting started with the web audio api.
... the web audio api does not replace the <audio> media element, but rather complements it, just like <canvas> coexists alongside the <img> element.
...if you simply want to control playback of an audio track, the <audio> media element provides a better, quicker solution than the web audio api.
...And 20 more matches

Document and website structure - Learn web development
previous overview: introduction to html next in addition to defining individual parts of your page (such as "a paragraph" or "an image"), html also boasts a number of block level elements used to define areas of your website (such as "the header", "the navigation menu", "the main content column").
... this article looks into how to plan a basic website structure, and write the html to represent this structure.
... objective: learn how to structure your document using semantic tags, and how to work out the structure of a simple website.
...And 19 more matches

Web Authentication API - Web APIs
the web authentication api is an extension of the credential management api that enables strong authentication with public key cryptography, enabling passwordless authentication and/or secure second-factor authentication without sms texts.
... web authentication concepts and usage the web authentication api (also referred to as webauthn) uses asymmetric (public-key) cryptography instead of passwords or sms texts for registering, authenticating, and second-factor authentication with websites.
... many websites already have pages that allow users to register new accounts or sign in to an existing account, and the web authentication api acts as a replacement or supplement to those on those existing webpages.
...And 19 more matches

How much does it cost to do something on the Web? - Learn web development
getting involved on the web isn't as cheap as it looks.
... prerequisites: you should already understand what software you need, the difference between a webpage, a website, etc., and what a domain name is.
... objective: review the complete process for creating a website and find out how much each step can cost.
...And 18 more matches

How do I start to design my website? - Learn web development
prerequisites: none objective: learn to define goals to give direction to your web project.
... summary when starting with a web project, many people focus on the technical side.
... so when you get an idea and want to turn it into a website, there are a few questions you should answer before anything else: what exactly do i want to accomplish?
...And 18 more matches

WebSocket - Web APIs
the websocket object provides the api for creating and managing a websocket connection to a server, as well as for sending and receiving data on the connection.
... to construct a websocket, use the websocket() constructor.
... constructor websocket(url[, protocols]) returns a newly created websocket object.
...And 18 more matches

Using the Web Animations API - Web APIs
the web animations api lets us construct animations and control their playback with javascript.
... meet the web animations api the web animations api opens the browser’s animation engine to developers and manipulation by javascript.
...it is one of the most performant ways to animate on the web, letting the browser make its own internal optimizations without hacks, coercion, or window.requestanimationframe().
...And 18 more matches

Getting started with the Web - Learn web development
getting started with the web is a concise series introducing you to the practicalities of web development.
... you'll set up the tools you need to construct a simple webpage and publish your own simple code.
... the story of your first website it's a lot of work to create a professional website, so if you're new to web development, we encourage you to start small.
...And 17 more matches

WebGL model view projection - Web APIs
this article explores how to take data within a webgl project, and project it into the proper spaces to display it on the screen.
... the model, view, and projection matrices individual transformations of points and polygons in space in webgl are handled by the basic transformation matrices like translation, scale, and rotation.
... clip space in a webgl program, data is typically uploaded to the gpu with its own coordinate system and then the vertex shader transforms those points into a special coordinate system known as clip space.
...And 17 more matches

What software do I need to build a website? - Learn web development
in this article we lay out which software components you need when you're editing, uploading, or viewing a website.
... prerequisites: you should already know the difference between webpages, websites, web servers, and search engines.
... objective: learn which software components you need if you want to edit, upload, or view a website.
...And 16 more matches

Writing WebSocket client applications - Web APIs
websocket client applications use the websocket api to communicate with websocket servers using the websocket protocol.
... note: this feature is available in web workers.
... note: the example snippets in this article are taken from our websocket chat client/server sample.
...And 16 more matches

How do you make sure your website works properly? - Learn web development
in this article we go over various troubleshooting steps for a website and some basic actions to take in order to solve these issues.
... prerequisites: you need to know how to upload files to a web server.
... objective: you will learn how to diagnose and resolve some basic issues you can run into with your website.
...And 15 more matches

Web performance - Learn web development
building websites requires html, css, and javascript.
... to build websites and applications people want to use, which attract and retain users, you need to create a good user experience.
...this is known as web performance, and in this module you'll focus on the fundamentals of how to create performant websites.
...And 15 more matches

WebGLRenderingContext.makeXRCompatible() - Web APIs
the webglrenderingcontext method makexrcompatible() ensures that the rendering context described by the webglrenderingcontext is ready to render the scene for the immersive webxr device on which it will be displayed.
... if necessary, the webgl layer may reconfigure the context to be ready to render to a different device than it originally was.
... syntax let makecompatpromise = webglrenderingcontext.makexrcompatible(); parameters none.
...And 15 more matches

Adding 2D content to a WebGL context - Web APIs
« previousnext » once you've successfully created a webgl context, you can start rendering into it.
... there are two shader functions run when drawing webgl content: the vertex shader and the fragment shader.
... you write these in glsl and pass the text of the code into webgl to be compiled for execution on the gpu.
...And 15 more matches

Using textures in WebGL - Web APIs
ew uint8array([0, 0, 255, 255]); // opaque blue gl.teximage2d(gl.texture_2d, level, internalformat, width, height, border, srcformat, srctype, pixel); const image = new image(); image.onload = function() { gl.bindtexture(gl.texture_2d, texture); gl.teximage2d(gl.texture_2d, level, internalformat, srcformat, srctype, image); // webgl1 has different requirements for power of 2 images // vs non power of 2 images so check if the image is a // power of 2 in both dimensions.
...ge gl.texparameteri(gl.texture_2d, gl.texture_wrap_s, gl.clamp_to_edge); gl.texparameteri(gl.texture_2d, gl.texture_wrap_t, gl.clamp_to_edge); gl.texparameteri(gl.texture_2d, gl.texture_min_filter, gl.linear); } }; image.src = url; return texture; } function ispowerof2(value) { return (value & (value - 1)) == 0; } the loadtexture() routine starts by creating a webgl texture object texture by calling the webgl createtexture() function.
... webgl1 can only use non power of 2 textures with filtering set to nearest or linear and it can not generate a mipmap for them.
...And 15 more matches

WebVR — Virtual Reality for the Web - Game development
the concept of virtual reality in itself isn't new, but now we have the technology to have it working as it should be, and a javascript api to make use of it in web applications.
... this article introduced webvr from the perspective of its use in games.
...there are many devices to chose from: desktop ones like oculus rift or htc vive, through consoles with playstation vr (which admittedly doesn't support webvr at this time), to mobile experiences like gear vr or google cardboard.
...And 14 more matches

How do you upload your files to a web server? - Learn web development
prerequisites: you must know what a web server is and how domain names work.
... you must also know how to set up a basic environment and how to write a simple webpage.
... summary if you have built a simple web page (see html basics for an example), you will probably want to put it online, on a web server.
...And 14 more matches

What will your website look like? - Learn web development
previous overview: getting started with the web next what will your website look like?
... discusses the planning and design work you have to do for your website before writing code, including "what information does my website offer?", "what fonts and colors do i want?", and "what does my site do?" first things first: planning before doing anything, you need some ideas.
... what should your website actually do?
...And 14 more matches

What is web performance? - Learn web development
previous overview: performance next web performance is all about making web sites fast, including making slow processes seem fast.
...this article provides a brief introduction to objective, measureable web performance*, looking at what technologies, techniques, and tools are involved in web optimization.
... prerequisites: basic computer literacy, basic software installed, and basic knowledge of client-side web technologies.
...And 14 more matches

WebGLRenderingContext.texImage2D() - Web APIs
the webglrenderingcontext.teximage2d() method of the webgl api specifies a two-dimensional texture image.
... syntax // webgl1: void gl.teximage2d(target, level, internalformat, width, height, border, format, type, arraybufferview?
...pixels); // webgl2: void gl.teximage2d(target, level, internalformat, width, height, border, format, type, glintptr offset); void gl.teximage2d(target, level, internalformat, width, height, border, format, type, htmlcanvaselement source); void gl.teximage2d(target, level, internalformat, width, height, border, format, type, htmlimageelement source); void gl.teximage2d(target, level, internalformat, width, height...
...And 14 more matches

WebGLRenderingContext.vertexAttribPointer() - Web APIs
the webglrenderingcontext.vertexattribpointer() method of the webgl api binds the buffer currently bound to gl.array_buffer to a generic vertex attribute of the current vertex buffer object and specifies its layout.
...possible values: gl.byte: signed 8-bit integer, with values in [-128, 127] gl.short: signed 16-bit integer, with values in [-32768, 32767] gl.unsigned_byte: unsigned 8-bit integer, with values in [0, 255] gl.unsigned_short: unsigned 16-bit integer, with values in [0, 65535] gl.float: 32-bit ieee floating point number when using a webgl 2 context, the following values are available additionally: gl.half_float: 16-bit ieee floating point number normalized a glboolean specifying whether integer data values should be normalized into a certain range when being cast to a float.
... a gl.invalid_operation error is thrown if no webglbuffer is bound to the array_buffer target.
...And 14 more matches

Lifetime of a WebRTC session - Web APIs
webrtc lets you build peer-to-peer communication of arbitrary data, audio, or video—or any combination thereof—into a browser application.
... in this article, we'll look at the lifetime of a webrtc session, from establishing the connection all the way through closing the connection when it's no longer needed.
... this article doesn't get into details of the actual apis involved in establishing and handling a webrtc connection; it simply reviews the process in general with some information about why each step is required.
...And 14 more matches

The "why" of web performance - Learn web development
overview: performance next web performance is all about making websites fast, including making slow processes seem fast.
... this article provides an introduction into why web performance is important to site visitors and for your business goals.
... prerequisites: basic computer literacy, basic software installed, and basic knowledge of client-side web technologies.
...And 13 more matches

Web-based protocol handlers - Web APIs
background it's fairly common to find web pages link to resources using non-http protocols.
... an example is the mailto: protocol: <a href="mailto:webmaster@example.com">web master</a> web authors can use a mailto: link when they want to provide a convenient way for users to send an email, directly from the webpage.
... web-based protocol handlers allow web-based applications to participate in the process too.
...And 13 more matches

Server-side website programming first steps - Learn web development
we then provide an overview of some of the most popular server-side web frameworks, along with guidance on how to select the most suitable framework for creating your first site.
... finally, we provide a high-level introductory article about web server security.
... prerequisites before starting this module, you don't need to have any knowledge of server-side website programming, or indeed any other type of programming.
...And 12 more matches

WEBGL_draw_buffers - Web APIs
the webgl_draw_buffers extension is part of the webgl api and enables a fragment shader to write to several textures, which is useful for deferred shading, for example.
... webgl extensions are available using the webglrenderingcontext.getextension() method.
... for more information, see also using extensions in the webgl tutorial.
...And 12 more matches

Loading and running WebAssembly code - WebAssembly
to use webassembly in javascript, you first need to pull your module into memory before compilation/instantiation.
... this article provides a reference for the different mechanisms that can be used to fetch webassembly bytecode, as well as how to compile/instantiate then run it.
... webassembly is not yet integrated with <script type='module'> or es2015 import statements, thus there is not a path to have the browser fetch modules for you using imports.
...And 12 more matches

WebGLRenderingContext.bufferData() - Web APIs
the webglrenderingcontext.bufferdata() method of the webgl api initializes and creates the buffer object's data store.
... syntax // webgl1: void gl.bufferdata(target, size, usage); void gl.bufferdata(target, arraybuffer?
... srcdata, usage); void gl.bufferdata(target, arraybufferview srcdata, usage); // webgl2: void gl.bufferdata(target, arraybufferview srcdata, usage, srcoffset, length); parameters target a glenum specifying the binding point (target).
...And 11 more matches

WebGLRenderingContext.isEnabled() - Web APIs
the webglrenderingcontext.isenabled() method of the webgl api tests whether a specific webgl capability is enabled or not for this context.
... syntax glboolean gl.isenabled(cap); parameters cap a glenum specifying which webgl capability to test.
...see webglrenderingcontext.blendfunc().
...And 11 more matches

WebGL tutorial - Web APIs
webgl enables web content to use an api based on opengl es 2.0 to perform 3d rendering in an html <canvas> in browsers that support it without the use of plug-ins.
... webgl programs consist of control code written in javascript and special effects code (shader code) that is executed on a computer's graphics processing unit (gpu).
... webgl elements can be mixed with other html elements and composited with other parts of the page or page background.
...And 11 more matches

Spaces and reference spaces: Spatial tracking in WebXR - Web APIs
the webxr apis used for implementing augmented and virtual reality is designed specifically to provide the ability to insert a human into a virtual environment.
...but webxr goes beyond that by adding the ability to track the location, orientation, and motion of the input devices which generate data used to determine the position and movement of individual parts of the viewer's body (with appropriate equipment).
... in this guide, we'll explore how webxr uses spaces and, more specifically, reference spaces, to track the positions, orientations, and movements of objects and of the user's body in the virtual world.
...And 11 more matches

Using Web Workers - Web APIs
web workers are a simple means for web content to run scripts in background threads.
...this article provides a detailed introduction to using web workers.
... web workers api a worker is an object created using a constructor (e.g.
...And 11 more matches

Installing and uninstalling web apps - Progressive web apps (PWAs)
web application installation is a feature available in modern browsers that allows users to choose to easily and conveniently “install” a web application on their device so they can access it in the same way they would any other installed app.
... depending on the device and features of the operating system and browser, this can result in what is essentially a fully featured application (for example, using webapk on android) or as a shortcut added to their device’s screen.
... the option to install a web application is part of the progressive web app philosophy—giving web apps the same user experience advantages as native apps so they can be competitive.
...And 11 more matches

Compiling an Existing C Module to WebAssembly - WebAssembly
a core use-case for webassembly is to take the existing ecosystem of c libraries and allow developers to use them on the web.
... as an example, let's compile an encoder for webp to wasm.
... the source for the webp codec is written in c and available on github as well as some extensive api documentation.
...And 11 more matches

Adding vector graphics to the Web - Learn web development
in this article we'll show you how to include one in your webpage.
... objective: learn how to embed an svg (vector) image into a webpage.
... note: this article doesn't intend to teach you svg; just what it is, and how to add it to web pages.
...And 10 more matches

WebGLRenderingContext.getUniformLocation() - Web APIs
part of the webgl api, the webglrenderingcontext method getuniformlocation() returns the location of a specific uniform variable which is part of a given webglprogram.
... the uniform variable is returned as a webgluniformlocation object, which is an opaque identifier used to specify where in the gpu's memory that uniform variable is located.
... syntax webgluniformlocation = webglrenderingcontext.getuniformlocation(program, name); parameters program the webglprogram in which to locate the specified uniform variable.
...And 10 more matches

Getting started with WebGL - Web APIs
next » webgl enables web content to use an api based on opengl es 2.0 to perform 2d and 3d rendering in an html canvas in browsers that support it without the use of plug-ins.
... webgl programs consist of control code written in javascript and shader code (glsl) that is executed on a computer's graphics processing unit (gpu).
... webgl elements can be mixed with other html elements and composited with other parts of the page or page background.
...And 10 more matches

Using WebGL extensions - Web APIs
webgl, like its sister apis (opengl and opengl es), supports extensions.
... a complete list of extensions is available in the khronos webgl extension registry.
... note: in webgl, unlike in other gl apis, extensions are only available if explicitly requested.
...And 10 more matches

Web Audio API best practices - Web APIs
in this article, we'll share a number of best practices — guidelines, tips, and tricks for working with the web audio api.
... loading sounds/files there are four main ways to load sound with the web audio api and it can be a little confusing as to which one you should use.
...you can see an example of how to use this with the web audio api in the using the web audio api tutorial.
...And 10 more matches

XRWebGLLayer.framebuffer - Web APIs
the read-only xrwebgllayer property framebuffer is an opaque webglframebuffer which is used to buffer the rendered image if the xr compositor is being used.
...the opaque framebuffer is functionally nearly the same as a standard webgl framebuffer, except for the differences covered in the section how opaque framebuffers are special below.
... syntax let framebuffer = xrwebgllayer.framebuffer; value a webglframebuffer object representing the framebuffer into which the 3d scene is being rendered, or null if the xr compositor is disabled for the session.
...And 10 more matches

XRWebGLLayer - Web APIs
the xrwebgllayer interface of the webxr device api provides a linkage between the webxr device (or simulated xr device, in the case of an inline session) and a webgl context used to render the scene for display on the device.
... in particular, it provides access to the webgl framebuffer and viewport to ease access to the context.
... although xrwebgllayer is currently the only type of framebuffer layer supported by webgl, it's entirely possible that future updates to the webxr specification may allow for other layer types and corresponding image sources.
...And 10 more matches

Server-side website programming - Learn web development
the dynamic websites – server-side programming topic is a series of modules that show how to create dynamic websites; websites that deliver customised information in response to http requests.
... most major websites use some kind of server-side technology to dynamically display data as required.
... in the modern world of web development, learning about server-side development is highly recommended.
...And 9 more matches

WebGLRenderingContext.disable() - Web APIs
the webglrenderingcontext.disable() method of the webgl api disables specific webgl capabilities for this context.
... syntax void gl.disable(cap); parameters cap a glenum specifying which webgl capability to disable.
...see webglrenderingcontext.blendfunc().
...And 9 more matches

WebGLRenderingContext.enable() - Web APIs
the webglrenderingcontext.enable() method of the webgl api enables specific webgl capabilities for this context.
... syntax void gl.enable(cap); parameters cap a glenum specifying which webgl capability to enable.
...see webglrenderingcontext.blendfunc().
...And 9 more matches

WebGLRenderingContext.getFramebufferAttachmentParameter() - Web APIs
the webglrenderingcontext.getframebufferattachmentparameter() method of the webgl api returns information about a framebuffer's attachment.
... when using a webgl 2 context, the following values are available additionally: gl.draw_framebuffer: equivalent to gl.framebuffer.
... when using a webgl 2 context, the following values are available additionally: gl.color_attachment1 gl.color_attachment2 gl.color_attachment3 gl.color_attachment4 gl.color_attachment5 gl.color_attachment6 gl.color_attachment7 gl.color_attachment8 gl.color_attachment9 gl.color_attachment10 gl.color_attachment11 gl.color_attachment12 gl.color_attac...
...And 9 more matches

Detect WebGL - Web APIs
« previousnext » this example demonstrates how to detect a webgl rendering context and reports the result to the user.
... feature-detecting webgl in this first example we are going to check whether the browser supports webgl.
... to that end we will try to obtain the webgl rendering context from a canvas element.
...And 9 more matches

Using WebRTC data channels - Web APIs
once you've established a webrtc peer connection using the rtcpeerconnection interface, you're able to send and receive media data between the two peers on the connection.
... but there's a lot more you can do with webrtc.
... since all webrtc components are required to use encryption, any data transmitted on an rtcdatachannel is automatically secured using datagram transport layer security (dtls).
...And 9 more matches

Using the Web Speech API - Web APIs
the web speech api provides two distinct areas of functionality — speech recognition, and speech synthesis (also known as text to speech, or tts) — which open up interesting new possibilities for accessibility, and control mechanisms.
... the web speech api has a main controller interface for this — speechrecognition — plus a number of closely-related interfaces for representing grammar, results, etc.
... note: on some browsers, like chrome, using speech recognition on a web page involves a server-based recognition engine.
...And 9 more matches

Front-end web developer - Learn web development
welcome to our front-end web developer learning pathway!
... here we provide you with a structured course that will teach you all you need to know to become a front-end web developer.
... subjects covered the subjects covered are: basic setup and learning how to learn web standards and best practices (such as accessibility and cross-browser compatibility) html, the language that gives web content structure and meaning css, the language used to style web pages javascript, the scripting language used to create dynamic functionality on the web tooling that is used to facilitate modern client-side web development.
...And 8 more matches

Structuring the web with HTML - Learn web development
to build websites, you should know about html — the fundamental technology used to define the structure of a webpage.
... html is used to specify whether your web content should be recognized as a paragraph, list, heading, link, image, multimedia player, form, or one of many other available elements or even a new element that you define.
... looking to become a front-end web developer?
...And 8 more matches

The business case for web performance - Learn web development
previous overview: performance we've discussed the importance of web performance.
... you've learned what you need to do to optimize for web performance.
... prerequisites: basic computer literacy, basic knowledge of client-side web technologies, and a basic understanding of web performance optimization.
...And 8 more matches

Web Push API Notifications best practices - Web APIs
this article provides a useful summary of best practices to keep in mind when developing web sites and applications that use push notifications for user engagement.
... overview of web push notifications web push notifications (created using a combination of the notifications, push, and service worker apis) are part of the rising noise that product developers and marketers are using to get attention for their sites.
... searching the web for "web push notifications," you'll find articles from marketing experts who believe you should use push to re-engage people who have left your site so they can complete a purchase, or be sent the latest news, or receive links to recommended products.
...And 8 more matches

WEBGL_depth_texture - Web APIs
the webgl_depth_texture extension is part of the webgl api and defines 2d depth and depth-stencil textures.
... webgl extensions are available using the webglrenderingcontext.getextension() method.
... for more information, see also using extensions in the webgl tutorial.
...And 8 more matches

WebGLActiveInfo - Web APIs
the webglactiveinfo interface is part of the webgl api and represents the information returned by calling the webglrenderingcontext.getactiveattrib() and webglrenderingcontext.getactiveuniform() methods.
... properties webglactiveinfo.name the read-only name of the requested variable.
... webglactiveinfo.size the read-only size of the requested variable.
...And 8 more matches

WebGLRenderingContext.pixelStorei() - Web APIs
the webglrenderingcontext.pixelstorei() method of the webgl api specifies the pixel storage modes.
... glint 4 1, 2, 4, 8 opengl es 2.0 gl.unpack_flip_y_webgl flips the source data along its vertical axis if true.
... glboolean false true, false webgl gl.unpack_premultiply_alpha_webgl multiplies the alpha channel into the other color channels glboolean false true, false webgl gl.unpack_colorspace_conversion_webgl default color space conversion or no color space conversion.
...And 8 more matches

WebGLRenderingContext.texSubImage2D() - Web APIs
the webglrenderingcontext.texsubimage2d() method of the webgl api specifies a sub-rectangle of the current texture.
... syntax // webgl 1: void gl.texsubimage2d(target, level, xoffset, yoffset, width, height, format, type, arraybufferview?
...pixels); // webgl 2: void gl.texsubimage2d(target, level, xoffset, yoffset, format, type, glintptr offset); void gl.texsubimage2d(target, level, xoffset, yoffset, width, height, format, type, htmlcanvaselement source); void gl.texsubimage2d(target, level, xoffset, yoffset, width, height, format, type, htmlimageelement source); void gl.texsubimage2d(target, level, xoffset, yoffset, width, height, format, type, ht...
...And 8 more matches

WebGL types - Web APIs
the following types are used in webgl interfaces.
... webgl 1 these types are used within a webglrenderingcontext.
... type web idl type description glenum unsigned long used for enums.
...And 8 more matches

Writing a WebSocket server in C# - Web APIs
introduction if you would like to use the websocket api, it is useful if you have a server.
... first steps websockets communicate over a tcp (transmission control protocol) connection.
...e.writeline("a client connected."); networkstream stream = client.getstream(); //enter to an infinite cycle to be able to handle every change in stream while (true) { while (!stream.dataavailable); byte[] bytes = new byte[client.available]; stream.read(bytes, 0, bytes.length); } handshaking when a client connects to a server, it sends a get request to upgrade the connection to a websocket from a simple http request.
...And 8 more matches

Basic concepts behind Web Audio API - Web APIs
this article explains some of the audio theory behind how the features of the web audio api work, to help you make informed decisions while designing how audio is routed through your app.
... it won't turn you into a master sound engineer, but it will give you enough background to understand why the web audio api works like it does.
... audio graphs the web audio api involves handling audio operations inside an audio context, and has been designed to allow modular routing.
...And 8 more matches

Autoplay guide for media and Web Audio APIs - Web media technologies
in this guide, we'll cover autoplay functionality in the various media and web audio apis, including a brief overview of how to use autoplay and how to work with browsers to handle autoplay blocking gracefully.
... that means that both of the following are considered autoplay behavior, and are therefore subject to the browser's autoplay blocking policy: <audio src="/music.mp4" autoplay> and audioelement.play(); the following web features and apis may be affected by autoplay blocking: the html <audio> and <video> elements the web audio api from the user's perspective, a web page or app that spontaneously starts making noise without warning can be jarring, inconvenient, or off-putting.
... for details, see the auto-play policies for google chrome and webkit.
...And 8 more matches

Client-side web APIs - Learn web development
when writing client-side javascript for web sites or applications, you will quickly encounter application programming interfaces (apis).
... apis are programming features for manipulating different aspects of the browser and operating system the site is running on, or manipulating data from other web sites or services.
... looking to become a front-end web developer?
...And 7 more matches

HTMLInputElement.webkitdirectory - Web APIs
the htmlinputelement.webkitdirectory is a property that reflects the webkitdirectory html attribute and indicates that the <input> element should let the user select directories instead of files.
...the selected file system entries can be obtained using the webkitentries property.
... syntax htmlinputelement.webkitdirectory = boolvalue value a boolean; true if the <input> element should allow picking only directories or false if only files should be selectable.
...And 7 more matches

WebGLRenderingContext.bindBuffer() - Web APIs
the webglrenderingcontext.bindbuffer() method of the webgl api binds a given webglbuffer to a target.
... when using a webgl 2 context, the following values are available additionally: gl.copy_read_buffer: buffer for copying from one buffer object to another.
... buffer a webglbuffer to bind.
...And 7 more matches

WebGLRenderingContext.compressedTexImage[23]D() - Web APIs
the webglrenderingcontext.compressedteximage2d() and webgl2renderingcontext.compressedteximage3d() methods of the webgl api specify a two- or three-dimensional texture image in a compressed format.
... compressed image formats must be enabled by webgl extensions before using these methods.
... syntax // webgl 1: void gl.compressedteximage2d(target, level, internalformat, width, height, border, arraybufferview?
...And 7 more matches

Establishing a connection: The WebRTC perfect negotiation pattern - Web APIs
because webrtc doesn't mandate a specific transport mechanism for signaling during the negotiation of a new peer connection, it's highly flexible.
...this article introduces webrtc perfect negotiation, describing how it works and why it's the recommended way to negotiate a webrtc connection between peers, and provides sample code to demonstrate the technique.
... after the first deployments of webrtc-capable browsers, it was realized that parts of the negotiation process were more complicated than they needed to be for typical use cases.
...And 7 more matches

Web Animations API Concepts - Web APIs
the web animations api (waapi) provides javascript developers access to the browser’s animation engine and describes how animations should be implemented across browsers.
...to learn how to put the api to use, check out its sister article, using the web animations api.
... the web animations api fills the gap between declarative css animations and transitions, and dynamic javascript animations.
...And 7 more matches

Web Workers API - Web APIs
web workers makes it possible to run a script operation in a background thread separate from the main execution thread of a web application.
... web workers concepts and usage a worker is an object created using a constructor (e.g.
...but you can use a large number of items available under window, including websockets, and data storage mechanisms like indexeddb.
...And 7 more matches

XRWebGLLayer() - Web APIs
the webxr device api xrwebgllayer() constructor creates and returns a new xrwebgllayer object, providing the linkage between the webxr device and the webgl graphics layer used to render the 3d scene.
... syntax let gllayer = new xrwebgllayer(session, context, layerinit); parameters session an xrsession object specifying the webxr session which will be rendered using the webgl context.
... context a webglrenderingcontext or webgl2renderingcontext identifying the webgl drawing context to use for rendering the scene for the specified webxr session.
...And 7 more matches

XRWebGLLayer.getNativeFramebufferScaleFactor() static method - Web APIs
the static method xrwebgllayer.getnativeframebufferscalefactor() returns a floating-point scaling factor by which one can multiply the specified xrsession's resolution to get the native resolution of the webxr device's frame buffer.
... this information can be used when creating a new xrwebgllayer to configure the xrwebgllayerinit property framebufferscalefactor in the options specified when calling the xrwebgllayer() constructor.
... syntax let nativescaling = xrwebgllayer.getnativeframebufferscalefactor(session); parameters session the xrsession for which to return the native framebuffer scaling factor.
...And 7 more matches

Styling web forms - Learn web development
previous overview: forms next in the previous few articles we looked at all the html you'll need to create and structure your web forms.
...website owners want form styles that fit in with their overall site design more than ever, and the web platform has changed to make this more possible.
...this decision is yours to make, as the designer of your site, or web application.
...And 6 more matches

WEBGL_debug_renderer_info - Web APIs
the webgl_debug_renderer_info extension is part of the webgl api and exposes two constants with information about the graphics driver for debugging purposes.
...generally, the graphics driver information should only be used in edge cases to optimize your webgl content or to debug gpu problems.
... the webglrenderingcontext.getparameter() method can help you to detect which features are supported and the failifmajorperformancecaveat context attribute lets you control if a context should be returned at all, if the performance would be dramatically slow.
...And 6 more matches

WebGLRenderingContext.compressedTexSubImage2D() - Web APIs
the webglrenderingcontext.compressedtexsubimage2d() method of the webgl api specifies a two-dimensional sub-rectangle for a texture image in a compressed format.
... compressed image formats must be enabled by webgl extensions before using this method or a webgl2renderingcontext must be used.
... syntax // webgl 1: void gl.compressedtexsubimage2d(target, level, xoffset, yoffset, width, height, format, arraybufferview?
...And 6 more matches

A basic 2D WebGL animation example - Web APIs
in this webgl example, we create a canvas and within it render a rotating square using webgl.
... the standard webgl global gl_position is then set to the transformed and rotated vertex's position.
... html the html consists solely of the <canvas> that we'll obtain a webgl context on.
...And 6 more matches

Using DTMF with WebRTC - Web APIs
in order to more fully support audio/video conferencing, webrtc supports sending dtmf to the remote peer on an rtcpeerconnection.
... this article offers a brief high-level overview of how dtmf works over webrtc, then provides a guide for everyday developers about how to send dtmf over an rtcpeerconnection.
... webrtc doesn't send dtmf codes as audio data.
...And 6 more matches

Improving compatibility using WebRTC adapter.js - Web APIs
while the webrtc specification is relatively stable, not all browsers have fully implemented all of its features.
... in addition, some browsers still have prefixes on some or all webrtc apis.
...the webrtc organization provides on github the webrtc adapter to work around compatibility issues in different browsers' webrtc implementations.
...And 6 more matches

Exported WebAssembly functions - WebAssembly
exported webassembly functions are how webassembly functions are represented in javascript.
... exported webassembly functions are basically just javascript wrappers that represent webassembly functions in javascript.
... you can retrieve exported webassembly functions in two ways: by calling table.prototype.get() on an existing table.
...And 6 more matches

What do common web layouts contain? - Learn web development
when designing pages for your website, it's good to have an idea of the most common layouts.
... prerequisites: make sure you've already thought about what you want to accomplish with your web project.
... objective: learn where to put things on your webpages, and how to put them there.
...And 5 more matches

Web forms — Working with user data - Learn web development
this module provides a series of articles that will help you master the essentials of web forms.
... web forms are a very powerful tool for interacting with users — most commonly they are used for collecting data from users, or allowing them to control a user interface.
...in the articles listed below, we'll cover all the essential aspects of web forms including marking up their html structure, styling form controls, validating form data, and submitting data to the server.
...And 5 more matches

DataTransferItem.webkitGetAsEntry() - Web APIs
if the item described by the datatransferitem is a file, webkitgetasentry() returns a filesystemfileentry or filesystemdirectoryentry representing it.
... this function is implemented as webkitgetasentry() in non-webkit browsers including firefox at this time; it may be renamed to simply getasentry() in the future, so you should code defensively, looking for both.
... syntax datatransferitem.webkitgetasentry(); parameters none.
...And 5 more matches

HTMLInputElement.webkitEntries - Web APIs
the read-only webkitentries property of the htmlinputelement interface contains an array of file system entries (as objects based on filesystementry) representing files and/or directories selected by the user using an <input> element of type file, but only if that selection was made using drag-and-drop: selecting a file in the dialog will leave the property empty (bug 1326031).
... the array can only contain directories if the webkitdirectory property is true.
... this property is called webkitentries in the specification due to its origins as a google chrome-specific api.
...And 5 more matches

WEBGL_compressed_texture_atc - Web APIs
the webgl_compressed_texture_atc extension is part of the webgl api and exposes 3 atc compressed texture formats.
... webgl extensions are available using the webglrenderingcontext.getextension() method.
... for more information, see also using extensions in the webgl tutorial.
...And 5 more matches

WEBGL_lose_context - Web APIs
the webgl_lose_context extension is part of the webgl api and exposes functions to simulate losing and restoring a webglrenderingcontext.
... webgl extensions are available using the webglrenderingcontext.getextension() method.
... for more information, see also using extensions in the webgl tutorial.
...And 5 more matches

WebGLRenderingContext.bindFramebuffer() - Web APIs
the webglrenderingcontext.bindframebuffer() method of the webgl api binds a given webglframebuffer to a target.
... when using a webgl 2 context, the following values are available additionally: gl.draw_framebuffer: equivalent to gl.framebuffer.
... framebuffer a webglframebuffer object to bind.
...And 5 more matches

WebGLRenderingContext.bindTexture() - Web APIs
the webglrenderingcontext.bindtexture() method of the webgl api binds a given webgltexture to a target (binding point).
... when using a webgl 2 context, the following values are available additionally: gl.texture_3d: a three-dimensional texture.
... texture a webgltexture object to bind.
...And 5 more matches

WebGLRenderingContext.checkFramebufferStatus() - Web APIs
the webglrenderingcontext.checkframebufferstatus() method of the webgl api returns the completeness status of the webglframebuffer object.
... when using a webgl 2 context, the following values are available additionally: gl.draw_framebuffer: equivalent to gl.framebuffer.
... when using a webgl 2 context, the following values can be returned additionally: gl.framebuffer_incomplete_multisample: the values of gl.renderbuffer_samples are different among attached renderbuffers, or are non-zero if the attached images are a mix of renderbuffers and textures.
...And 5 more matches

WebGLRenderingContext.getActiveUniform() - Web APIs
the webglrenderingcontext.getactiveuniform() method of the webgl api returns a webglactiveinfo object containing size, type, and name of a uniform attribute.
... syntax webglactiveinfo webglrenderingcontext.getactiveuniform(program, index); parameters program a webglprogram specifying the webgl shader program from which to obtain the uniform variable's information.
... return value a webglactiveinfo object describing the uniform.
...And 5 more matches

WebGLRenderingContext.getTexParameter() - Web APIs
the webglrenderingcontext.gettexparameter() method of the webgl api returns information about the given texture.
... when using a webgl 2 context, the following values are available additionally: gl.texture_3d: a three-dimensional texture.
...possible values: pname return type description possible return values available in a webgl 1 context gl.texture_mag_filter glenum texture magnification filter gl.linear (default value), gl.nearest.
...And 5 more matches

WebGLRenderingContext.getUniform() - Web APIs
the webglrenderingcontext.getuniform() method of the webgl api returns the value of a uniform variable at a given location.
... syntax any gl.getuniform(program, location); parameters program a webglprogram containing the uniform attribute.
... location a webgluniformlocation object containing the location of the uniform attribute to get.
...And 5 more matches

WebGLRenderingContext.renderbufferStorage() - Web APIs
the webglrenderingcontext.renderbufferstorage() method of the webgl api creates and initializes a renderbuffer object's data store.
... gl.depth_stencil when using a webgl 2 context, the following values are available additionally: gl.r8 gl.r8ui gl.r8i gl.r16ui gl.r16i gl.r32ui gl.r32i gl.rg8 gl.rg8ui gl.rg8i gl.rg16ui gl.rg16i gl.rg32ui gl.rg32i gl.rgb8 gl.rgba8 gl.srgb8_alpha8 (also available as an extension for webgl 1, see below) gl.rgb10_a2 gl.rgba8ui gl.rgba8i gl.rgb10_a...
...2ui gl.rgba16ui gl.rgba16i gl.rgba32i gl.rgba32ui gl.depth_component24 gl.depth_component32f gl.depth24_stencil8 gl.depth32f_stencil8 when using the webgl_color_buffer_float extension: ext.rgba32f_ext: rgba 32-bit floating-point type.
...And 5 more matches

WebGLRenderingContext.texParameter[fi]() - Web APIs
the webglrenderingcontext.texparameter[fi]() methods of the webgl api set texture parameters.
... when using a webgl 2 context, the following values are available additionally: gl.texture_3d: a three-dimensional texture.
... pname description param available in webgl 1 gl.texture_mag_filter texture magnification filter gl.linear (default value), gl.nearest.
...And 5 more matches

WebRTC connectivity - Web APIs
this article describes how the various webrtc-related protocols interact with one another in order to create a connection and transfer data and/or media among peers.
... signaling unfortunately, webrtc can’t create connections without some sort of server in the middle.
... session descriptions the configuration of an endpoint on a webrtc connection is called a session description.
...And 5 more matches

Writing a WebSocket server in Java - Web APIs
introduction this example shows you how to create a websocket api server using oracle java.
... although other server-side languages can be used to create a websocket server, this example uses oracle java to simplify the example code.
... first steps websockets communicate over a tcp (transmission control protocol) connection.
...And 5 more matches

WebXR application life cycle - Web APIs
in this guide, we'll get a birds-eye view of what's involved in creating and driving a webxr application, without diving down to the code level in detail.
... this serves as preparation for the next few articles in these webxr guides, which cover starting up and shutting down a webxr session, geometry, simulating cameras, spatial tracking, and more.
... life cycle outline most applications using webxr will follow a similar overall design pattern: check to see if the user's device and browser are both capable of presenting the xr experience you want to provide.
...And 5 more matches

Lighting a WebXR setting - Web APIs
because the webxr device api relies on other technologies—namely, webgl and frameworks based upon it—to perform all rendering, texturing, and lighting of a scene, the same general lighting concepts apply to webxr settings or scenes as to any other webgl-generated display.
...the webgl shader program takes the color, directionality, brightness, and other factors for each light source and computes the final color of each pixel.
...the rate at which the brightness of a point light falls off is called attenuation, and is a configurable feature of the light source in webgl and other lighting systems.
...And 5 more matches

How to fix a website with blocked mixed content - Web security
this page explains what you should be aware of as a web developer.
... your website may break if your website delivers https pages, all active mixed content delivered via http on this pages will be blocked by default.
... consequently, your website may appear broken to users (if iframes or plugins don't load, etc.).
...And 5 more matches

Compiling a New C/C++ Module to WebAssembly - WebAssembly
when you’ve written a new code module in a language like c/c++, you can compile it into webassembly using a tool like emscripten.
...there are a number of options available when compiling with emscripten, but the main two scenarios we'll cover are: compiling to wasm and creating html to run our code in, plus all the javascript "glue" code needed to run the wasm in the web environment.
... creating html and javascript this is the simplest case we'll look at, whereby you get emscripten to generate everything you need to run your code, as webassembly, in the browser.
...And 5 more matches

Caching compiled WebAssembly modules - WebAssembly
warning: experimental webassembly.module indexeddb serialization support is being removed from browsers; see bug 1469395 and this spec issue.
... caching is useful for improving the performance of an app — we can store compiled webassembly modules on the client so they don't have to be downloaded and compiled every time.
... this includes compiled wasm modules (webassembly.module javascript objects).
...And 5 more matches

Use JavaScript within a webpage - Learn web development
take your webpages to the next level by harnessing javascript.
... about javascript javascript is a programming language mostly used client-side to make webpages interactive.
... you can create amazing webpages without javascript, but javascript opens up a whole new level of possibilities.
...And 4 more matches

File.webkitRelativePath - Web APIs
the file.webkitrelativepath is a read-only property that contains a usvstring which specifies the file's path relative to the directory selected by the user in an <input> element with its webkitdirectory attribute set.
... syntax relativepath = file.webkitrelativepath value a usvstring containing the path of the file relative to the ancestor directory the user selected.
... html content <input type="file" id="filepicker" name="filelist" webkitdirectory multiple /> <ul id="listing"></ul> javascript content document.getelementbyid("filepicker").addeventlistener("change", function(event) { let output = document.getelementbyid("listing"); let files = event.target.files; for (let i=0; i<files.length; i++) { let item = document.createelement("li"); item.innerhtml = files[i].webkitrelativepath; output.appendchild(item); }; }, false); result specifications specification status comment ...
...And 4 more matches

WEBGL_color_buffer_float - Web APIs
the webgl_color_buffer_float extension is part of the webgl api and adds the ability to render to 32-bit floating-point color buffers.
... webgl extensions are available using the webglrenderingcontext.getextension() method.
... for more information, see also using extensions in the webgl tutorial.
...And 4 more matches

WEBGL_debug_shaders - Web APIs
the webgl_debug_shaders extension is part of the webgl api and exposes a method to debug shaders from privileged contexts.
... this extension is not directly available to web sites as the way of how the shader is translated may uncover personally-identifiable information to the web page about the kind of graphics card in the user's computer.
... webgl extensions are available using the webglrenderingcontext.getextension() method.
...And 4 more matches

WebGL2RenderingContext.createTransformFeedback() - Web APIs
the webgl2renderingcontext.createtransformfeedback() method of the webgl 2 api creates and initializes webgltransformfeedback objects.
... syntax webgltransformfeedback gl.createtransformfeedback(); parameters none.
... return value a webgltransformfeedback object.
...And 4 more matches

WebGL2RenderingContext.fenceSync() - Web APIs
the webgl2renderingcontext.fencesync() method of the webgl 2 api creates a new webglsync object and inserts it into the gl command stream.
... syntax webglsync gl.fencesync(condition, flags); parameters condition a glenum specifying the condition that must be met to set the sync object's state to signaled.
... return value a webglsync object.
...And 4 more matches

WebGL2RenderingContext.isTransformFeedback() - Web APIs
the webgl2renderingcontext.istransformfeedback() method of the webgl 2 api returns true if the passed object is a valid webgltransformfeedback object.
... syntax glboolean gl.istransformfeedback(transformfeedback); parameters transformfeedback a webgltransformfeedback object to test.
... return value a glboolean indicating whether the given object is a valid webgltransformfeedback object (true) or not (false).
...And 4 more matches

WebGLRenderingContext.enableVertexAttribArray() - Web APIs
the webglrenderingcontext method enablevertexattribarray(), part of the webgl api, turns on the generic vertex attribute array at the specified index into the list of attribute arrays.
... in webgl, values that apply to a specific vertex are stored in attributes.
...others are assigned by the webgl layer when you create the attributes.
...And 4 more matches

WebGLRenderingContext.framebufferRenderbuffer() - Web APIs
the webglrenderingcontext.framebufferrenderbuffer() method of the webgl api attaches a webglrenderbuffer object to a webglframebuffer object.
... when using a webgl 2 context, the following values are available additionally: gl.draw_framebuffer: equivalent to gl.framebuffer.
... when using a webgl 2 context, the following values are available additionally: gl.color_attachment1 gl.color_attachment2 gl.color_attachment3 gl.color_attachment4 gl.color_attachment5 gl.color_attachment6 gl.color_attachment7 gl.color_attachment8 gl.color_attachment9 gl.color_attachment10 gl.color_attachment11 gl.color_attachment12 gl.color_attac...
...And 4 more matches

WebGLRenderingContext.framebufferTexture2D() - Web APIs
the webglrenderingcontext.framebuffertexture2d() method of the webgl api attaches a texture to a webglframebuffer.
... when using a webgl 2 context, the following values are available additionally: gl.draw_framebuffer: equivalent to gl.framebuffer.
... when using a webgl 2 context, the following values are available additionally: gl.depth_stencil_attachment: depth and stencil buffer.
...And 4 more matches

WebGLRenderingContext.getBufferParameter() - Web APIs
the webglrenderingcontext.getbufferparameter() method of the webgl api returns information about the buffer.
... when using a webgl 2 context, the following values are available additionally: gl.copy_read_buffer: buffer for copying from one buffer object to another.
... when using a webgl 2 context, the following values are available additionally: gl.static_read, gl.dynamic_read, gl.stream_read, gl.static_copy, gl.dynamic_copy, gl.stream_copy.
...And 4 more matches

WebGLRenderingContext.getExtension() - Web APIs
the webglrenderingcontext.getextension() method enables a webgl extension.
... syntax gl.getextension(name); parameters name a string for the name of the webgl extension to enable.
... return value a webgl extension object, or null if name does not match (case-insensitive) to one of the strings in webglrenderingcontext.getsupportedextensions.
...And 4 more matches

WebGLRenderingContext.getSupportedExtensions() - Web APIs
the webglrenderingcontext.getsupportedextensions() method returns a list of all the supported webgl extensions.
... syntax gl.getsupportedextensions(); return value an array of strings with all the supported webgl extensions.
... examples var canvas = document.getelementbyid('canvas'); gl = canvas.getcontext('webgl'); var extensions = gl.getsupportedextensions(); // array [ 'angle_instanced_arrays', 'ext_blend_minmax', ...
...And 4 more matches

WebGLRenderingContext.getVertexAttrib() - Web APIs
the webglrenderingcontext.getvertexattrib() method of the webgl api returns information about a vertex attribute at a given position.
...possible values: gl.vertex_attrib_array_buffer_binding: returns the currently bound webglbuffer.
... when using a webgl 2 context, the following values are available additionally: gl.vertex_attrib_array_integer: returns a glboolean indicating whether or not an integer data type is in the vertex attribute array at the given index.
...And 4 more matches

WebGLShader - Web APIs
the webglshader is part of the webgl api and can either be a vertex or a fragment shader.
... a webglprogram requires both types of shaders.
... description to create a webglshader use webglrenderingcontext.createshader, then hook up the glsl source code using webglrenderingcontext.shadersource(), and finally invoke webglrenderingcontext.compileshader() to finish and compile the shader.
...And 4 more matches

WebGL by example - Web APIs
next » webgl by example is a series of live samples with short explanations that showcase webgl concepts and capabilities.
... the examples are sorted according to topic and level of difficulty, covering the webgl rendering context, shader programming, textures, geometry, user interaction, and more.
... instead of trying to juggle shaders, geometry, and working with gpu memory, already in the first program, the examples here explore webgl in an incremental way.
...And 4 more matches

Web audio spatialization basics - Web APIs
as if its extensive variety of sound processing (and other) options wasn't enough, the web audio api also includes facilities to allow you to emulate the difference in sound as a listener moves around a sound source, for example panning as you move around a sound source inside a 3d game.
... basics of spatialization in web audio, complex 3d spatializations are created using the pannernode, which in layman's terms is basically a whole lotta cool maths to make audio appear in 3d space.
... it's really useful for webxr and gaming.
...And 4 more matches

Functions and classes available to Web Workers - Web APIs
unknown no postmessage() yes, on dedicatedworkerglobalscope no no unknown no apis available in workers function functionality support in gecko (firefox) support in ie support in blink (chrome and opera) support in webkit (safari) broadcast channel api allows simple communication between browsing contexts (that is windows, tabs, frames, or iframes) with the same origin (usually pages from the same site).
... 41 (41) (yes) (yes) (yes) console api provides access to the browser's debugging console (e.g., the web console in firefox).
...manipulating such data can be a complex task better suited to be delegated to a web worker.
...And 4 more matches

XRWebGLLayer.antialias - Web APIs
the read-only xrwebgllayer property antialias is a boolean value which is true if the rendering layer's frame buffer supports antialiasing.
...the specific antialiasing technique used is left to the user agent's discretion and cannot be specified by the web site or web app.
... syntax let antialiasingsupported = xrwebgllayer.antialias; value a boolean value which is true if the webgl rendering layer's frame buffer is configured to support antialiasing.
...And 4 more matches

Using Web Standards in your Web Pages - Archive of obsolete content
the problem lies with designers and developers chained to the browser-quirk-oriented markup of the 1990s-often because they don't realize it is possible to support current standards while accommodating old browsers." -web standards project this article provides an overview of the process for upgrading the content of your web pages to conform to the world wide web consortium (w3c) web standards.
...how to upgrade a webpage markup code to pass validation and how to implement css are addressed by providing recommendations, tutorials and references.
... the other sections address dom and dhtml coding practices which are at odds with the w3c web standards and suggest replacements.
...And 3 more matches

API - MDN Web Docs Glossary: Definitions of Web-related terms
in web development, an api is generally a set of code features (e.g.
... methods, properties, events, and urls) that a developer can use in their apps for interacting with components of a user's web browser, or other software/hardware on the user's computer, or third party websites and services.
... for example: the getusermedia api can be used to grab audio and video from a user's webcam, which can then be used in any way the developer likes, for example, recording video and audio, broadcasting it to another user in a conference call, or capturing image stills from the video.
...And 3 more matches

Search engine - MDN Web Docs Glossary: Definitions of Web-related terms
a search engine is a software system that collects information from the world wide web and presents it to users who are looking for specific information.
... a search engine conducts the following processes: web crawling: searching web sites by navigating hyperlinks on web pages, both within a site, and from one site to another.
... a web site owner can exclude areas of the site from being accessed by a search engine's web crawler (or spider), by defining "robot exclusion" information in a file named robots.txt.
...And 3 more matches

Vendor Prefix - MDN Web Docs Glossary: Definitions of Web-related terms
browser vendors sometimes add prefixes to experimental or nonstandard css properties and javascript apis, so developers can experiment with new ideas while—in theory—preventing their experiments from being relied upon and then breaking web developers' code during the standardization process.
...web developers have been using them on production web sites, despite their experimental nature.
... this has made it more difficult for browser vendors to ensure compatibility and to work on new features; it's also been harmful to smaller browsers who wind up forced to add other browsers' prefixes in order to load popular web sites.
...And 3 more matches

MDN Web Docs Glossary: Definitions of Web-related terms
web technologies contain long lists of jargon and abbreviations that are used in documentation and coding.
... this glossary provides definitions of words and abbreviations you need to know to successfully understand and build for the web.
... main axis main thread markup mathml media media (audio-visual presentation) media (css) metadata method microsoft edge microsoft internet explorer middleware mime mime type minification mitm mixin mobile first modem modern web apps modularity mozilla firefox mutable mvc n namespace nan nat native navigation directive netscape navigator network throttling nntp node node (dom) node (networking) node.js non-normative normative null ...
...And 3 more matches

Web performance resources - Learn web development
there are many reasons why your website should perform as well as possible.
... quick wins css web performance is all about user experience and perceived performance.
... web fonts eot and ttf formats are not compressed by default.
...And 3 more matches

WEBGL_compressed_texture_etc1 - Web APIs
the webgl_compressed_texture_etc1 extension is part of the webgl api and exposes the etc1 compressed texture format.
... webgl extensions are available using the webglrenderingcontext.getextension() method.
... for more information, see also using extensions in the webgl tutorial.
...And 3 more matches

WEBGL_compressed_texture_pvrtc - Web APIs
the webgl_compressed_texture_pvrtc extension is part of the webgl api and exposes four pvrtc compressed texture formats.
... webgl extensions are available using the webglrenderingcontext.getextension() method.
... for more information, see also using extensions in the webgl tutorial.
...And 3 more matches

WEBGL_compressed_texture_s3tc - Web APIs
the webgl_compressed_texture_s3tc extension is part of the webgl api and exposes four s3tc compressed texture formats.
... webgl extensions are available using the webglrenderingcontext.getextension() method.
... for more information, see also using extensions in the webgl tutorial.
...And 3 more matches

WEBGL_compressed_texture_s3tc_srgb - Web APIs
the webgl_compressed_texture_s3tc_srgb extension is part of the webgl api and exposes four s3tc compressed texture formats for the srgb colorspace.
... webgl extensions are available using the webglrenderingcontext.getextension() method.
... for more information, see also using extensions in the webgl tutorial.
...And 3 more matches

WebGL2RenderingContext.createQuery() - Web APIs
the webgl2renderingcontext.createquery() method of the webgl 2 api creates and initializes webglquery objects, which provide ways to asynchronously query for information.
... syntax webglquery gl.createquery(); parameters none.
... return value a webglquery object.
...And 3 more matches

WebGL2RenderingContext.createSampler() - Web APIs
the webgl2renderingcontext.createsampler() method of the webgl 2 api creates and initializes webglsampler objects.
... syntax webglsampler gl.createsampler(); parameters none.
... return value a webglsampler object.
...And 3 more matches

WebGL2RenderingContext.deleteSync() - Web APIs
the webgl2renderingcontext.deletesync() method of the webgl 2 api deletes a given webglsync object.
... syntax void gl.deletesync(sync); parameters sync a webglsync object to delete.
... examples gl must be a webgl2renderingcontext.
...And 3 more matches

WebGL2RenderingContext.deleteTransformFeedback() - Web APIs
the webgl2renderingcontext.deletetransformfeedback() method of the webgl 2 api deletes a given webgltransformfeedback object.
... syntax void gl.deletetransformfeedback(transformfeedback); parameters transformfeedback a webgltransformfeedback object to delete.
... examples gl must be a webgl2renderingcontext.
...And 3 more matches

WebGL2RenderingContext.isQuery() - Web APIs
the webgl2renderingcontext.isquery() method of the webgl 2 api returns true if the passed object is a valid webglquery object.
... syntax glboolean gl.isquery(query); parameters query a webglquery object to test.
... return value a glboolean indicating whether the given object is a valid webglquery object (true) or not (false).
...And 3 more matches

WebGL2RenderingContext.isSampler() - Web APIs
the webgl2renderingcontext.issampler() method of the webgl 2 api returns true if the passed object is a valid webglsampler object.
... syntax glboolean gl.issampler(sampler); parameters sampler a webglsampler object to test.
... return value a glboolean indicating whether the given object is a valid webglsampler object (true) or not (false).
...And 3 more matches

WebGL2RenderingContext.isSync() - Web APIs
the webgl2renderingcontext.issync() method of the webgl 2 api returns true if the passed object is a valid webglsync object.
... syntax glboolean gl.issync(sync); parameters sync a webglsync object to test.
... return value a glboolean indicating whether the given object is a valid webglsync object (true) or not (false).
...And 3 more matches

WebGLContextEvent - Web APIs
the webcontextevent interface is part of the webgl api and is an interface for an event that is generated in response to a status change to the webgl rendering context.
... <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a xlink:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="38.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="25" x2="116" y2="...
...25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/webglcontextevent" target="_top"><rect x="116" y="1" width="170" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="201" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">webglcontextevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface inherits properties from its parent interface, event.
...And 3 more matches

WebGLProgram - Web APIs
the webglprogram is part of the webgl api and is a combination of two compiled webglshaders consisting of a vertex shader and a fragment shader (both written in glsl).
... to create a webglprogram, call the gl context's createprogram() function.
... var program = gl.createprogram(); // attach pre-existing shaders gl.attachshader(program, vertexshader); gl.attachshader(program, fragmentshader); gl.linkprogram(program); if ( !gl.getprogramparameter( program, gl.link_status) ) { var info = gl.getprograminfolog(program); throw 'could not compile webgl program.
...And 3 more matches

WebGLRenderingContext.attachShader() - Web APIs
the webglrenderingcontext.attachshader() method of the webgl api attaches either a fragment or vertex webglshader to a webglprogram.
... syntax void gl.attachshader(program, shader); parameters program a webglprogram.
... shader a fragment or vertex webglshader.
...And 3 more matches

WebGLRenderingContext.blendEquationSeparate() - Web APIs
the webglrenderingcontext.blendequationseparate() method of the webgl api is used to set the rgb blend equation and alpha blend equation separately.
... the blend equation determines how a new pixel is combined with a pixel already in the webglframebuffer.
... when using a webgl 2 context, the following values are available additionally: gl.min: minimum of source and destination, gl.max: maximum of source and destination.
...And 3 more matches

WebGLRenderingContext.createProgram() - Web APIs
the webglrenderingcontext.createprogram() method of the webgl api creates and initializes a webglprogram object.
... syntax webglprogram gl.createprogram(); parameters none.
... return value a webglprogram object that is a combination of two compiled webglshaders consisting of a vertex shader and a fragment shader (both written in glsl).
...And 3 more matches

WebGLRenderingContext.getRenderbufferParameter() - Web APIs
the webglrenderingcontext.getrenderbufferparameter() method of the webgl api returns information about the renderbuffer.
... when using a webgl 2 context, the following value is available additionally: gl.renderbuffer_samples: returns a glint indicating the number of samples of the image of the currently bound renderbuffer.
... examples gl.getrenderbufferparameter(gl.renderbuffer, gl.renderbuffer_width); specifications specification status comment webgl 1.0the definition of 'getrenderbufferparameter' in that specification.
...And 3 more matches

WebGLShaderPrecisionFormat - Web APIs
the webglshaderprecisionformat interface is part of the webgl api and represents the information returned by calling the webglrenderingcontext.getshaderprecisionformat() method.
... properties webglshaderprecisionformat.rangemin read only the base 2 log of the absolute value of the minimum value that can be represented.
... webglshaderprecisionformat.rangemax read only the base 2 log of the absolute value of the maximum value that can be represented.
...And 3 more matches

Matrix math for the web - Web APIs
matrices can be used to represent transformations of objects in space, and are used for performing many key types of computation when constructing images and visualizing data on the web.
... while this article uses css to simplify explanations, matrices are a core concept used by many different technologies including webgl, the webxr (vr and ar) api, and glsl shaders.
...check out the webgl model view projection article for a look into how it comes in handy.
...And 3 more matches

WebXR performance guide - Web APIs
webxr applications involve multiple technologies which can be highly sensitive to performance constraints.
... as such, you may find yourself needing to make adjustments or compromises to optimize the performance of your webxr application to be as usable as possible on the broadest assortment of target devices.
... in this guide, we'll examine a variety of suggestions and recommendations that will help you make your webxr app as performant as possible.
...And 3 more matches

Web Animations API - Web APIs
the web animations api allows for synchronizing and timing changes to the presentation of a web page, i.e.
... concepts and usage the web animations api provides a common language for browsers and developers to describe animations on dom elements.
... to get more information on the concepts behind the api and how to use it, read using the web animations api.
...And 3 more matches

Web Locks API - Web APIs
the web locks api allows scripts running in one tab or worker to asynchronously acquire a lock, hold it while work is performed, then release it.
... while held, no other script executing in the same origin can acquire the same lock, which allows a web app running in multiple tabs or workers to coordinate work and the use of resources.
... web locks concepts and usage a lock is an abstract concept representing some potentially shared resource, identified by a name chosen by the web app.
...And 3 more matches

Web Speech API - Web APIs
the web speech api enables you to incorporate voice data into web apps.
... the web speech api has two parts: speechsynthesis (text-to-speech), and speechrecognition (asynchronous speech recognition.) web speech concepts and usage the web speech api makes web apps able to handle voice data.
... for more details on using these features, see using the web speech api.
...And 3 more matches

Web Storage API - Web APIs
the web storage api provides mechanisms by which browsers can store key/value pairs, in a much more intuitive fashion than using cookies.
... web storage concepts and usage the two mechanisms within web storage are as follows: sessionstorage maintains a separate storage area for each given origin that's available for the duration of the page session (as long as the browser is open, including page reloads and restores) stores data only for a session, meaning that the data is stored until the browser (or tab) is closed.
...this has been done to avoid memory issues caused by excessive usage of web storage.
...And 3 more matches

XRWebGLLayer.getViewport() - Web APIs
the xrwebgllayer interface's getviewport() method returns the xrviewport that should be used to render the specified xrview into the webgl layer.
... for webxr devices which use a single framebuffer for both the left and right eyes, the returned viewport represents the region of the framebuffer into which the scene should be rendered for the eye represented by the view.
... syntax let viewport = xrwebgllayer.getviewport(view); parameters view an xrview object indicating the view for which the viewport is to be returned.
...And 3 more matches

XRWebGLLayer.ignoreDepthValues - Web APIs
the read-only xrwebgllayer property ignoredepthvalues is a boolean value which is true if the session has been configured to ignore the values in the depth buffer while rendering the scene.
... the value of ignoredepthvalues can only be set when the xrwebgllayer is instantiated, by setting the corresponding value in the xrwebgllayerinit object specified as the constructor's layerinit parameter.
... syntax let ignoringdepthbuffer = xrwebgllayer.ignoredepthvalues; value a boolean value which is true if the webgl context's depth buffer is being used while computing the locations of points in the 3d world.
...And 3 more matches

XRWebGLLayerInit.antialias - Web APIs
the boolean antialias property, if present and set to true in the xrwebgllayerinit object provided as the xrwebgllayer() constructor's layerinit parameter, requests that the new webgl rendering layer support anti-aliasing.
... syntax let layerinit = { antialias: boolvalue }; let gllayer = new xrwebgllayer(xrsession, gl, layerinit); let gllayer = new xrwebgllayer(xrsession, gl, { antialias: boolvalue }); value a boolean value which can be set to true to request anti-aliasing support in the new webgl rendering layer.
... usage notes the state of anti-aliasing for the context after being created can be read from the xrwebgllayer property antialias.
...And 3 more matches

XRWebGLLayerInit.framebufferScaleFactor - Web APIs
the xrwebgllayerinit dictionary's framebufferscalefactor property, when specified upon instantiating a new xrwebgllayer using its constructor, xrwebgllayer(), specifies the scaling factor to use when determining the size of the frame buffer to use when rendering the scene, relative to the default xr device display resolution.
...see managing rendering quality in webxr performance guide for more information.
... you can determine the scaling factor that you would need to apply to match the default frame buffer resolution by using the xrwebgllayer.getnativeframebufferscalefactor() static function.
...And 3 more matches

XRWebGLLayerInit.ignoreDepthValues - Web APIs
the xrwebgllayerinit dictionary's boolean ignoredepthvalues property can be provided in the options passed into the xrwebgllayer() constructor to indicate that the depth buffer, if it exists, should be ignored while composing the scene.
... this property differs from depth in that depth requests a webgl layer that does not have a depth buffer at all, while ignoredepthvalues merely asks that the depth layer be ignored.
... syntax let layerinit = { ignoredepthvalues: boolvalue }; let gllayer = new xrwebgllayer(xrsession, gl, layerinit); let gllayer = new xrwebgllayer(xrsession, gl, { ignoredepthvalues: boolvalue }); value a boolean value which can be set to true to disable the use of the depth buffer by the webgl rendering layer created by the xrwebgllayer() constructor.
...And 3 more matches

Web API reference - Web technology reference
the web offers a wide variety of apis to perform various useful tasks.
... these can be accessed using javascript code, and let you do anything from making minor adjustments to any window or element, to generating intricate graphical and audio effects using apis such as webgl and web audio.
... device apis this set of apis allows access to various hardware features available to web pages and applications.
...And 3 more matches

Converting WebAssembly text format to wasm - WebAssembly
webassembly has an s-expression-based textual representation, an intermediate form designed to be exposed in text editors, browser developer tools, etc.
...historically, a .wast extension was also used, however that's now used for the scripting language used by the webassembly testsuite.
... a first look at the text format let’s look at a simple example of this — the following program imports a function called imported_func from a module called imports, and exports a function called exported_func: (module (func $i (import "imports" "imported_func") (param i32)) (func (export "exported_func") i32.const 42 call $i ) ) the webassembly function exported_func is exported for use in our environment (e.g.
...And 3 more matches

HTML - MDN Web Docs Glossary: Definitions of Web-related terms
html (hypertext markup language) is a descriptive language that specifies webpage structure.
... brief history in 1990, as part of his vision of the web, tim berners-lee defined the concept of hypertext, which berners-lee formalized the following year through a markup mainly based on sgml.
...in 1994 berners-lee founded the w3c to develop the web.
...And 2 more matches

SEO - MDN Web Docs Glossary: Definitions of Web-related terms
seo (search engine optimization) is the process of making a website more visible in search results, also termed improving search rankings.
... search engines crawl the web, following links from page to page, and index the content found.
...if you follow those rules closely when doing seo for a website, you give the site the best chances of showing up among the first results, increasing traffic and possibly revenue (for ecommerce and ads).
...And 2 more matches

How do you host your website on Google App Engine? - Learn web development
google app engine is a powerful platform that lets you build and run applications on google’s infrastructure — whether you need to build a multi-tiered web application from scratch or host a static website.
... here's a step-by-step guide to hosting your website on google app engine.
... have a look at the sample application's structure — the website folder contains your website content and app.yaml is your application configuration file.
...And 2 more matches

HTMLCanvasElement: webglcontextrestored event - Web APIs
the webglcontextrestored event of the webgl api is fired if the user agent restores the drawing buffer for a webglrenderingcontext object.
... once the context is restored, webgl resources such as textures and buffers that were created before the context was lost are no longer valid.
... you need to reinitialize the state of your webgl application and recreate resources.
...And 2 more matches

WEBGL_compressed_texture_astc - Web APIs
the webgl_compressed_texture_astc extension is part of the webgl api and exposes adaptive scalable texture compression (astc) compressed texture formats to webgl.
... webgl extensions are available using the webglrenderingcontext.getextension() method.
... for more information, see also using extensions in the webgl tutorial.
...And 2 more matches

WEBGL_compressed_texture_etc - Web APIs
the webgl_compressed_texture_etc extension is part of the webgl api and exposes 10 etc/eac compressed texture formats.
... webgl extensions are available using the webglrenderingcontext.getextension() method.
... for more information, see also using extensions in the webgl tutorial.
...And 2 more matches

WEBGL_lose_context.loseContext() - Web APIs
the webgl_lose_context.losecontext() method is part of the webgl api and allows you to simulate losing the context of a webglrenderingcontext context.
... it triggers the steps described in the webgl specification for handling context lost.
... the context will remain lost until webgl_lose_context.restorecontext() is called.
...And 2 more matches

WebGL2RenderingContext.clientWaitSync() - Web APIs
the webgl2renderingcontext.clientwaitsync() method of the webgl 2 api blocks and waits for a webglsync object to become signaled or a given timeout to be passed.
... syntax glenum gl.clientwaitsync(sync, flags, timeout); parameters sync a webglsync object on which to wait on.
...must not be larger than gl.max_client_wait_timeout_webgl.
...And 2 more matches

WebGL2RenderingContext.deleteQuery() - Web APIs
the webgl2renderingcontext.deletequery() method of the webgl 2 api deletes a given webglquery object.
... syntax void gl.deletequery(query); parameters query a webglquery object to delete.
... examples gl must be a webgl2renderingcontext.
...And 2 more matches

WebGL2RenderingContext.deleteSampler() - Web APIs
the webgl2renderingcontext.deletesampler() method of the webgl 2 api deletes a given webglsampler object.
... syntax void gl.deletesampler(sampler); parameters sampler a webglsampler object to delete.
... examples gl must be a webgl2renderingcontext.
...And 2 more matches

WebGL2RenderingContext.framebufferTextureLayer() - Web APIs
the webgl2renderingcontext.framebuffertexturelayer() method of the webgl 2 api attaches a single layer of a texture to a framebuffer.
... this method is similar to webglrenderingcontext.framebuffertexture2d(), but only a given single layer of the texture level is attached to the attachment point.
... texture a webgltexture object whose image to attach.
...And 2 more matches

WebGL2RenderingContext.getIndexedParameter() - Web APIs
the webgl2renderingcontext.getindexedparameter() method of the webgl 2 api returns indexed information about a given target.
...possible values: gl.transform_feedback_buffer_binding: returns a webglbuffer.
... gl.uniform_buffer_binding: returns a webglbuffer.
...And 2 more matches

WebGL2RenderingContext.getTransformFeedbackVarying() - Web APIs
the webgl2renderingcontext.gettransformfeedbackvarying() method of the webgl 2 api returns information about varying variables from webgltransformfeedback buffers.
... syntax webglactiveinfo gl.gettransformfeedbackvarying(program, index); parameters program a webglprogram.
... return value a webglactiveinfo object.
...And 2 more matches

WebGL2RenderingContext.texImage3D() - Web APIs
the webglrenderingcontext.teximage3d() method of the webgl api specifies a three-dimensional texture image.
... offset a glintptr byte offset into the webglbuffer's data store.
... used to upload data to the currently bound webgltexture from the webglbuffer bound to the pixel_unpack_buffer target.
...And 2 more matches

WebGL2RenderingContext.texStorage2D() - Web APIs
the webgl2renderingcontext.texstorage2d() method of the webgl api specifies all levels of two-dimensional texture storage.
...possible values: gl.r8 gl.r16f gl.r32f gl.r8ui gl.rg8 gl.rg16f gl.rg32f gl.rg8ui gl.rgb8 gl.srgb8 gl.rgb565 gl.r11f_g11f_b10f gl.rgb9_e5 gl.rgb16f gl.rgb32f gl.rgb8ui gl.rgba8 gl.srgb8_aplha8 gl.rgb5_a1 gl.rgba4 gl.rgba16f gl.rgba32f gl.rgba8ui unlike opengl 3.0, webgl 2 doesn't support the following etc2 and eac compressed texture formats (see section 5.37 in the webgl 2 spec).
... you might be able to enable them via the webgl_compressed_texture_etc extension, though.
...And 2 more matches

WebGL2RenderingContext.texSubImage3D() - Web APIs
the webgl2renderingcontext.texsubimage3d() method of the webgl api specifies a sub-rectangle of the current texture.
... offset a glintptr byte offset into the webglbuffer's data store.
... used to upload data to the currently bound webgltexture from the webglbuffer bound to the pixel_unpack_buffer target.
...And 2 more matches

WebGLRenderingContext.blendEquation() - Web APIs
the webglrenderingcontext.blendequation() method of the webgl api is used to set both the rgb blend equation and alpha blend equation to a single equation.
... the blend equation determines how a new pixel is combined with a pixel already in the webglframebuffer.
... when using a webgl 2 context, the following values are available additionally: gl.min: minimum of source and destination, gl.max: maximum of source and destination.
...And 2 more matches

WebGLRenderingContext.bufferSubData() - Web APIs
the webglrenderingcontext.buffersubdata() method of the webgl api updates a subset of a buffer object's data store.
... syntax // webgl1: void gl.buffersubdata(target, offset, arraybuffer srcdata); void gl.buffersubdata(target, offset, arraybufferview srcdata); // webgl2: void gl.buffersubdata(target, dstbyteoffset, arraybufferview srcdata, srcoffset, length); parameters target a glenum specifying the binding point (target).
... when using a webgl 2 context, the following values are available additionally: gl.copy_read_buffer: buffer for copying from one buffer object to another.
...And 2 more matches

WebGLRenderingContext.createTexture() - Web APIs
the webglrenderingcontext.createtexture() method of the webgl api creates and initializes a webgltexture object.
... syntax webgltexture gl.createtexture(); parameters none.
... return value a webgltexture object to which images can be bound to.
...And 2 more matches

WebGLRenderingContext.getProgramInfoLog() - Web APIs
the webglrenderingcontext.getprograminfolog returns the information log for the specified webglprogram object.
... it contains errors that occurred during failed linking or validation of webglprogram objects.
... syntax gl.getprograminfolog(program); parameters program the webglprogram to query.
...And 2 more matches

WebGLRenderingContext.getProgramParameter() - Web APIs
the webglrenderingcontext.getprogramparameter() method of the webgl api returns information about the given program.
... syntax any gl.getprogramparameter(program, pname); parameters program a webglprogram to get parameter information from.
... when using a webgl 2 context, the following values are available additionally: gl.transform_feedback_buffer_mode: returns a glenum indicating the buffer mode when transform feedback is active.
...And 2 more matches

WebGLRenderingContext.readPixels() - Web APIs
the webglrenderingcontext.readpixels() method of the webgl api reads a block of pixels from a specified rectangle of the current color framebuffer into an arraybufferview object.
... syntax // webgl1: void gl.readpixels(x, y, width, height, format, type, pixels); // webgl2: void gl.readpixels(x, y, width, height, format, type, glintptr offset); void gl.readpixels(x, y, width, height, format, type, arraybufferview pixels, gluint dstoffset); parameters x a glint specifying the first horizontal pixel that is read from the lower left corner of a rectangular block of pixels.
... webgl2 adds gl.red gl.rg gl.red_integer gl.rg_integer gl.rgb_integer gl.rgba_integer type a glenum specifying the data type of the pixel data.
...And 2 more matches

WebGLRenderingContext.validateProgram() - Web APIs
the webglrenderingcontext.validateprogram() method of the webgl api validates a webglprogram.
... it checks if it is successfully linked and if it can be used in the current webgl state.
... syntax void gl.validateprogram(program); parameters program a webglprogram to validate.
...And 2 more matches

WebGLTransformFeedback - Web APIs
the webgltransformfeedback interface is part of the webgl 2 api and enables transform feedback, which is the process of capturing primitives generated by vertex processing.
... when working with webgltransformfeedback objects, the following methods of the webgl2renderingcontext are useful: webgl2renderingcontext.createtransformfeedback() webgl2renderingcontext.deletetransformfeedback() webgl2renderingcontext.istransformfeedback() webgl2renderingcontext.bindtransformfeedback() webgl2renderingcontext.begintransformfeedback() webgl2renderingcontext.endtransformfeedback() webgl2renderingcontext.pausetransformfeedback() webgl2renderingcontext.resumetransformfeedback() webgl2renderingcontext.transformfeedbackvaryings() webgl2renderingcontext.gettransformfeedbackvarying() examples creating a webgltransformfeedback object in this example, gl must be...
... a webgl2renderingcontext.
...And 2 more matches

Animating textures in WebGL - Web APIs
we need both of these checks because it will produce an error if you upload a video to webgl that has no data available yet.
... checking for both of these events guarantees there is data available and it's safe to start uploading video to a webgl texture.
... the video must be loaded from a secure source in order to be used to provide texture data to webgl.
...And 2 more matches

WebRTC Statistics API - Web APIs
the webrtc api has a vast array of statistics available, covering the entire breadth of the webrtc connectivity system, from sender to receiver and peer to peer.
... collecting statistics you can collect statistics at various levels throughout the webrtc hierarchy of objects.
...this has been obsoleted since the transition to webrtc being track-based rather than stream-based.
...And 2 more matches

WebXR permissions and security - Web APIs
the webxr device api has several areas of security to contend with, from establishing feature-policy to ensuring the user intends to use the mixed reality presentation before activating it.
... introduction the webxr device api is subject to a number of permission and security controls.
... once that check is passed, the request to enter immersive-vr mode is allowed if all of the following are true: the requestsession() call was issued by code executing within the handler for a user event, or the from the startup code for a user-launched web application.
...And 2 more matches

Using the Web Storage API - Web APIs
the web storage api provides mechanisms by which browsers can securely store key/value pairs.
...these three lines all set the (same) colorsetting entry: localstorage.colorsetting = '#a4509b'; localstorage['colorsetting'] = '#a4509b'; localstorage.setitem('colorsetting', '#a4509b'); note: it's recommended to use the web storage api (setitem, getitem, removeitem, key, length) to prevent the pitfalls associated with using plain objects as key-value stores.
... the two mechanisms within web storage are as follows: sessionstorage maintains a separate storage area for each given origin that's available for the duration of the page session (as long as the browser is open, including page reloads and restores).
...And 2 more matches

XRWebGLLayerInit.depth - Web APIs
when using the xrwebgllayer() constructor to create a new webgl rendering layer for webxr, providing as the layerinit parameter an object whose depth property is false will request that the new layer be created without a depth buffer.
... syntax let layerinit = { depth: false }; let gllayer = new xrwebgllayer(xrsession, gl, layerinit); let gllayer = new xrwebgllayer(xrsession, gl, { depth: false }); value a boolean which can be set to false to specify that the new webgl layer should not have a depth buffer.
... you can determine whether or not the depth buffer is being used by a given webgl rendering layer during your xr session by checking the value returned by xrwebgllayer.ignoredepthvalues.
...And 2 more matches

CSS - MDN Web Docs Glossary: Definitions of Web-related terms
css (cascading style sheets) is a declarative language that controls how webpages look in the browser.
...a style declaration contains the properties and their values, which determine how a webpage looks.
... css is one of the three core web technologies, along with html and javascript.
...this is a very important feature, since a complex website can have thousands of css rules.

Cookie - MDN Web Docs Glossary: Definitions of Web-related terms
a cookie is a small piece of information left on a visitor's computer by a website, via a web browser.
... cookies are used to personalize a user’s web experience with a website.
... it may contain the user’s preferences or inputs when accessing that website.
... a user can customize their web browser to accept, reject, or delete cookies.

WCAG - MDN Web Docs Glossary: Definitions of Web-related terms
web content accessibility guidelines (wcag) are a recommendation published by the web accessibility initiative group at the w3c.
... wcag uses three levels of conformance: priority 1: web developers must satisfy these requirements, otherwise it will be impossible for one or more groups to access the web content.
... priority 2: web developers should satisfy these requirements, otherwise some groups will find it difficult to access the web content.
... priority 3: web developers may satisfy these requirements, in order to make it easier for some groups to access the web content.

How to structure a web form - Learn web development
common html structures used with forms beyond the structures specific to web forms, it's good to remember that form markup is just html.
... this means that you can use all the power of html to structure a web form.
... summary you now have all the knowledge you'll need to properly structure your web forms.
... see also a list apart: sensible forms: a form usability checklist previous overview: forms next in this module your first form how to structure a web form basic native form controls the html5 input types other form controls styling web forms advanced form styling ui pseudo-classes client-side form validation sending form data advanced topics how to build custom form controls sending forms through javascript property compatibility table for form widgets ...

Using files from web applications - Web APIs
using the file api, which was added to the dom in html5, it's now possible for web content to ask the user to select local files and then read the contents of those files.
...(as of time of writing, firefox doesn’t show this visual cue for <input type="file"> elements.) selecting files using drag and drop you can also let the user drag and drop files into your web application.
... example: showing thumbnails of user-selected images let's say you're developing the next great photo-sharing website and want to use html to display thumbnail previews of images before the user actually uploads them.
... const percentage = math.round((e.loaded * 100) / e.total); self.ctrl.update(percentage); } }, false); xhr.upload.addeventlistener("load", function(e){ self.ctrl.update(100); const canvas = self.ctrl.ctx.canvas; canvas.parentnode.removechild(canvas); }, false); xhr.open("post", "http://demos.hacks.mozilla.org/paul/demos/resources/webservices/devnull.php"); xhr.overridemimetype('text/plain; charset=x-user-defined-binary'); reader.onload = function(evt) { xhr.send(evt.target.result); }; reader.readasbinarystring(file); } the fileupload() function shown above creates a throbber, which is used to display progress information, and then creates an xmlhttprequest to handle uploading the data.

WEBGL_debug_shaders.getTranslatedShaderSource() - Web APIs
the webgl_debug_shaders.gettranslatedshadersource() method is part of the webgl api and allows you to debug a translated shader.
... syntax gl.getextension('webgl_debug_shaders').gettranslatedshadersource(shader); parameters shader a webglshader to get the translated source from.
...an empty string is returned, if: no source has been defined or, webglrenderingcontext.compileshader() has not yet been called or, the translation for the shader failed.
... examples var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var shader = gl.createshader(gl.fragment_shader); gl.shadersource(shader, 'void main() { gl_fragcolor = vec4(gl_fragcoord.x, 0.0, 0.0, 1.0); }'); gl.compileshader(shader); var src = gl.getextension('webgl_debug_shaders').gettranslatedshadersource(shader); console.log(src); // "void main(){ // (gl_fragcolor = vec4(gl_fragcoord.x, 0.0, 0.0, 1.0)); // }" specifications specification status comment webgl_debug_shadersthe definition of 'webgl_debug_shaders.gettranslatedshadersource' in that specification.

WebGL2RenderingContext.bindBufferBase() - Web APIs
the webgl2renderingcontext.bindbufferbase() method of the webgl 2 api binds a given webglbuffer to a given binding point (target) at a given index.
... buffer a webglbuffer which to bind to the binding point (target).
... examples gl.bindbufferbase(gl.transform_feedback_buffer, 0, buffer); specifications specification status comment webgl 2.0the definition of 'bindbufferbase' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.bindBufferRange() - Web APIs
the webgl2renderingcontext.bindbufferrange() method of the webgl 2 api binds a range of a given webglbuffer to a given binding point (target) at a given index.
... buffer a webglbuffer which to bind to the binding point (target).
... examples gl.bindbufferrange(gl.transform_feedback_buffer, 1, buffer, 0, 4); specifications specification status comment webgl 2.0the definition of 'bindbufferrange' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.bindTransformFeedback() - Web APIs
the webgl2renderingcontext.bindtransformfeedback() method of the webgl 2 api binds a passed webgltransformfeedback object to the current gl state.
... transformfeedback a webgltransformfeedback object to bind.
... examples var transformfeedback = gl.createtransformfeedback(); gl.bindtransformfeedback(gl.transform_feedback, transformfeedback); specifications specification status comment webgl 2.0the definition of 'bindtransformfeedback' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.createVertexArray() - Web APIs
the webgl2renderingcontext.createvertexarray() method of the webgl 2 api creates and initializes a webglvertexarrayobject object that represents a vertex array object (vao) pointing to vertex array data and which provides names for different sets of vertex data.
... syntax webglvertexarrayobject gl.createvertexarray(); parameters none.
... return value a webglvertexarrayobject representing a vertex array object (vao) which points to vertex array data.
... specifications specification status comment webgl 2.0the definition of 'createvertexarray' in that specification.

WebGL2RenderingContext.drawArraysInstanced() - Web APIs
the webgl2renderingcontext.drawarraysinstanced() method of the webgl 2 api renders primitives from array data like the gl.drawarrays() method.
... note: when using webgl 1, the angle_instanced_arrays extension can provide this method, too.
... examples gl.drawarraysinstanced(gl.points, 0, 8, 4); specifications specification status comment webgl 2.0the definition of 'drawarraysinstanced' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.drawElementsInstanced() - Web APIs
the webgl2renderingcontext.drawelementsinstanced() method of the webgl 2 api renders primitives from array data like the gl.drawelements() method.
... note: when using webgl 1, the angle_instanced_arrays extension can provide this method, too.
... examples gl.drawelementsinstanced(gl.points, 2, gl.unsigned_short, 0, 4); specifications specification status comment webgl 2.0the definition of 'drawelementsinstanced' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.getActiveUniformBlockName() - Web APIs
the webgl2renderingcontext.getactiveuniformblockname() method of the webgl 2 api retrieves the name of the active uniform block at a given index within a webglprogram.
... syntax domstring gl.getactiveuniformblockname(program, uniformblockindex); parameters program a webglprogram containing the uniform block.
... examples var blockname = gl.getactiveuniformblockname(program, 0); specifications specification status comment webgl 2.0the definition of 'getactiveuniformblockname' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.getActiveUniformBlockParameter() - Web APIs
the webgl2renderingcontext.getactiveuniformblockparameter() method of the webgl 2 api retrieves information about an active uniform block within a webglprogram.
... syntax any gl.getactiveuniformblockparameter(program, uniformblockindex, pname); parameters program a webglprogram containing the active uniform block.
... examples var blocksize = gl.getactiveuniformblockparameter(program, blockindex, gl.uniform_block_data_size); specifications specification status comment webgl 2.0the definition of 'getactiveuniformblockparameter' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.getActiveUniforms() - Web APIs
the webgl2renderingcontext.getactiveuniforms() method of the webgl 2 api retrieves information about active uniforms within a webglprogram.
... syntax any gl.getactiveuniforms(program, uniformindices, pname); parameters program a webglprogram containing the active uniforms.
... examples var uniformindices = gl.getuniformindices(program, ['ubored', 'ubogreen', 'uboblue']); var uniformoffsets = gl.getactiveuniforms(program, uniformindices, gl.uniform_offset); specifications specification status comment webgl 2.0the definition of 'getactiveuniforms' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.getQuery() - Web APIs
the webgl2renderingcontext.getquery() method of the webgl 2 api returns the currently active webglquery for the target, or null.
... syntax webglquery gl.getquery(target, pname); parameters target a glenum specifying the target of the query.
... return value a webglquery object.
... examples var currentquery = gl.getquery(gl.any_samples_passed, gl.current_query); specifications specification status comment webgl 2.0the definition of 'getquery' in that specification.

WebGL2RenderingContext.getSyncParameter() - Web APIs
the webgl2renderingcontext.getsyncparameter() method of the webgl 2 api returns parameter information of a webglsync object.
... syntax any gl.getsyncparameter(sync, pname); parameters sync a webglsync object.
... examples var sync = gl.fencesync(gl.sync_gpu_commands_complete, 0); gl.getsyncparameter(sync, gl.sync_status); specifications specification status comment webgl 2.0the definition of 'getsyncparameter' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.getUniformBlockIndex() - Web APIs
the webgl2renderingcontext.getuniformblockindex() method of the webgl 2 api retrieves the index of a uniform block within a webglprogram.
... syntax gluint gl.getuniformblockindex(program, uniformblockname); parameters program a webglprogram containing the uniform block.
... examples // assuming a shader with the following declaration: // uniform ubodata { // mat4 foo; // } instancename; // use the block name, not the instance name: var blockindex = gl.getuniformblockindex(program, 'ubodata'); specifications specification status comment webgl 2.0the definition of 'getuniformblockindex' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.getUniformIndices() - Web APIs
the webgl2renderingcontext.getuniformindices() method of the webgl 2 api retrieves the indices of a number of uniforms within a webglprogram.
... syntax sequence<gluint> gl.getuniformindices(program, uniformnames); parameters program a webglprogram containing uniforms whose indices to query.
... examples var uniformindices = gl.getuniformindices(program, ['ubored', 'ubogreen', 'uboblue']); specifications specification status comment webgl 2.0the definition of 'getuniformindices' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.isVertexArray() - Web APIs
the webgl2renderingcontext.isvertexarray() method of the webgl api returns true if the passed object is a valid webglvertexarrayobject object.
... syntax glboolean gl.isvertexarray(vertexarray); parameters vertexarray a webglvertexarrayobject (vao) object to test.
... return value a glboolean indicating whether the given object is a valid webglvertexarrayobject object (true) or not (false).
... gl.isvertexarray(vao); specifications specification status comment webgl 2.0the definition of 'isvertexarray' in that specification.

WebGL2RenderingContext.samplerParameter[if]() - Web APIs
the webgl2renderingcontext.samplerparameter[if]() methods of the webgl 2 api set webglsampler parameters.
... syntax void gl.samplerparameteri(sampler, pname, param); void gl.samplerparameterf(sampler, pname, param); parameters sampler a webglsampler object.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetsamplerparameterichrome full support 56edge full support 79firefox full support 51ie no support noopera full support ...
... 43safari no support nowebview android full support 58chrome android full support 58firefox android full support 51opera android full support 43safari ios no support nosamsung internet android full support 7.0legend full support full support no support no support ...

WebGL2RenderingContext.transformFeedbackVaryings() - Web APIs
the webgl2renderingcontext.transformfeedbackvaryings() method of the webgl 2 api specifies values to record in webgltransformfeedback buffers.
... syntax void gl.transformfeedbackvaryings(program, varyings, buffermode); parameters program a webglprogram.
...sformfeedback = gl.createtransformfeedback(); gl.bindtransformfeedback(gl.transform_feedback, transformfeedback); var transformfeedbackoutputs = ['gl_position', 'anotheroutput']; gl.transformfeedbackvaryings(shaderprog, transformfeedbackoutputs, gl.interleaved_attribs); gl.linkprogram(shaderprog); specifications specification status comment webgl 2.0the definition of 'transformfeedbackvaryings' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.uniform[1234][uif][v]() - Web APIs
the webgl2renderingcontext.uniform[1234][uif][v]() methods of the webgl api specify values of uniform variables.
...orm4iv(location, data, optional srcoffset, optional srclength); void gl.uniform1uiv(location, data, optional srcoffset, optional srclength); void gl.uniform2uiv(location, data, optional srcoffset, optional srclength); void gl.uniform3uiv(location, data, optional srcoffset, optional srclength); void gl.uniform4uiv(location, data, optional srcoffset, optional srclength); parameters location a webgluniformlocation object containing the location of the uniform attribute to modify.
... specifications specification status comment webgl 2.0the definition of 'uniform' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.uniformBlockBinding() - Web APIs
the webgl2renderingcontext.uniformblockbinding() method of the webgl 2 api assigns binding points for active uniform blocks.
... syntax void gl.uniformblockbinding(program, uniformblockindex, uniformblockbinding); parameters program a webglprogram containing the active uniform block whose binding to assign.
... examples gl.uniformblockbinding(program, 0, 1); specifications specification status comment webgl 2.0the definition of 'uniformblockbinding' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.uniformMatrix[234]x[234]fv() - Web APIs
the webgl2renderingcontext.uniformmatrix[234]x[234]fv() methods of the webgl 2 api specify matrix values for uniform variables.
...l.uniformmatrix4x3fv(location, transpose, data, optional srcoffset, optional srclength); void gl.uniformmatrix2x4fv(location, transpose, data, optional srcoffset, optional srclength); void gl.uniformmatrix3x4fv(location, transpose, data, optional srcoffset, optional srclength); void gl.uniformmatrix4fv(location, transpose, data, optional srcoffset, optional srclength); parameters location a webgluniformlocation object containing the location of the uniform attribute to modify.
... examples gl.uniformmatrix2x3fv(loc, false, [1, 2, 3, 4, 5, 6]); specifications specification status comment webgl 2.0the definition of 'uniformmatrix' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.vertexAttribDivisor() - Web APIs
the webgl2renderingcontext.vertexattribdivisor() method of the webgl 2 api modifies the rate at which generic vertex attributes advance when rendering multiple instances of primitives with gl.drawarraysinstanced() and gl.drawelementsinstanced().
... note: when using webgl 1, the angle_instanced_arrays extension can provide this method, too.
... examples gl.vertexattribdivisor(0, 2); specifications specification status comment webgl 2.0the definition of 'vertexattribdivisor' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.vertexAttribIPointer() - Web APIs
the webgl2renderingcontext.vertexattribipointer() method of the webgl 2 api specifies integer data formats and locations of vertex attributes in a vertex attributes array.
... description very similar to webglrenderingcontext.vertexattribpointer().
... bones[boneindices.s] * vec4(position, 1.0) * boneweights.s + bones[boneindices.t] * vec4(position, 1.0) * boneweights.t + bones[boneindices.p] * vec4(position, 1.0) * boneweights.p + bones[boneindices.q] * vec4(position, 1.0) * boneweights.q; gl_position = mvmatrix * skinnedposition; } </script> specifications specification status comment webgl 2.0the definition of 'vertexattribipointer' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.waitSync() - Web APIs
the webgl2renderingcontext.waitsync() method of the webgl 2 api returns immediately, but waits on the gl server until the given webglsync object is signaled.
... syntax void gl.waitsync(sync, flags, timeout); parameters sync a webglsync object on which to wait on.
... examples var sync = gl.fencesync(gl.sync_gpu_commands_complete, 0); gl.waitsync(sync, 0, gl.timeout_ignored); specifications specification status comment webgl 2.0the definition of 'waitsync' in that specification.
... editor's draft initial definition for webgl.

WebGLQuery - Web APIs
the webglquery interface is part of the webgl 2 api and provides ways to asynchronously query for information.
... when working with webglquery objects, the following methods of the webgl2renderingcontext are useful: webgl2renderingcontext.createquery() webgl2renderingcontext.deletequery() webgl2renderingcontext.isquery() webgl2renderingcontext.beginquery() webgl2renderingcontext.endquery() webgl2renderingcontext.getquery() webgl2renderingcontext.getqueryparameter() examples creating a webglquery object in this example, gl must be a webgl2renderingcontext.
... webglquery objects are not available in webgl 1.
... var query = gl.createquery(); specifications specification status comment webgl 2.0the definition of 'webglquery' in that specification.

WebGLRenderingContext.bindAttribLocation() - Web APIs
the webglrenderingcontext.bindattriblocation() method of the webgl api binds a generic vertex index to an attribute variable.
... syntax void gl.bindattriblocation(program, index, name); parameters program a webglprogram object to bind.
...this name cannot start with "webgl_" or "_webgl_", as these are reserved for use by webgl.
... examples gl.bindattriblocation(program, colorlocation, 'vcolor'); specifications specification status comment webgl 1.0the definition of 'bindattriblocation' in that specification.

WebGLRenderingContext.bindRenderbuffer() - Web APIs
the webglrenderingcontext.bindrenderbuffer() method of the webgl api binds a given webglrenderbuffer to a target, which must be gl.renderbuffer.
... renderbuffer a webglrenderbuffer object to bind.
... examples binding a renderbuffer var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var renderbuffer = gl.createrenderbuffer(); gl.bindrenderbuffer(gl.renderbuffer, renderbuffer); getting current bindings to check the current renderbuffer binding, query the renderbuffer_binding constant.
... gl.getparameter(gl.renderbuffer_binding); specifications specification status comment webgl 1.0the definition of 'bindrenderbuffer' in that specification.

WebGLRenderingContext.blendFunc() - Web APIs
the webglrenderingcontext.blendfunc() method of the webgl api defines which function is used for blending pixel arithmetic.
... examples to use the blend function, you first have to activate blending with webglrenderingcontext.enable() with the argument gl.blend.
... gl.enable(gl.blend); gl.blendfunc(gl.src_color, gl.dst_color); gl.getparameter(gl.blend_src_rgb) == gl.src_color; // true specifications specification status comment webgl 1.0the definition of 'blendfunc' in that specification.
... in webgl, constant color and constant alpha cannot be used together as source and destination factors in the blend function.

WebGLRenderingContext.blendFuncSeparate() - Web APIs
the webglrenderingcontext.blendfuncseparate() method of the webgl api defines which function is used for blending pixel arithmetic for rgb and alpha components separately.
... examples to use the blend function, you first have to activate blending with webglrenderingcontext.enable() with the argument gl.blend.
... gl.enable(gl.blend); gl.blendfuncseparate(gl.src_color, gl.dst_color, gl.one, gl.zero); gl.getparameter(gl.blend_src_rgb) == gl.src_color; // true specifications specification status comment webgl 1.0the definition of 'blendfunc' in that specification.
... in webgl, constant color and constant alpha cannot be used together as source and destination factors in the blend function.

WebGLRenderingContext.createBuffer() - Web APIs
the webglrenderingcontext.createbuffer() method of the webgl api creates and initializes a webglbuffer storing data such as vertices or colors.
... syntax webglbuffer gl.createbuffer(); parameters none.
... return value a webglbuffer storing data such as vertices or colors.
... examples creating a buffer var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var buffer = gl.createbuffer(); specifications specification status comment webgl 1.0the definition of 'createbuffer' in that specification.

WebGLRenderingContext.createFramebuffer() - Web APIs
the webglrenderingcontext.createframebuffer() method of the webgl api creates and initializes a webglframebuffer object.
... syntax webglframebuffer gl.createframebuffer(); parameters none.
... return value a webglframebuffer object.
... examples creating a frame buffer var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var framebuffer = gl.createframebuffer(); specifications specification status comment webgl 1.0the definition of 'createframebuffer' in that specification.

WebGLRenderingContext.createRenderbuffer() - Web APIs
the webglrenderingcontext.createrenderbuffer() method of the webgl api creates and initializes a webglrenderbuffer object.
... syntax webglrenderbuffer gl.createrenderbuffer(); parameters none.
... return value a webglrenderbuffer object that stores data such an image, or can be source or target of an rendering operation.
... examples creating a render buffer var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var renderbuffer = gl.createrenderbuffer(); specifications specification status comment webgl 1.0the definition of 'createrenderbuffer' in that specification.

WebGLRenderingContext.deleteBuffer() - Web APIs
the webglrenderingcontext.deletebuffer() method of the webgl api deletes a given webglbuffer.
... syntax void gl.deletebuffer(buffer); parameters buffer a webglbuffer object to delete.
... examples deleting a buffer var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var buffer = gl.createbuffer(); // ...
... gl.deletebuffer(buffer); specifications specification status comment webgl 1.0the definition of 'deletebuffer' in that specification.

WebGLRenderingContext.deleteFramebuffer() - Web APIs
the webglrenderingcontext.deleteframebuffer() method of the webgl api deletes a given webglframebuffer object.
... syntax void gl.deleteframebuffer(framebuffer); parameters framebuffer a webglframebuffer object to delete.
... examples deleting a frame buffer var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var framebuffer = gl.createframebuffer(); // ...
... gl.deleteframebuffer(framebuffer); specifications specification status comment webgl 1.0the definition of 'deleteframebuffer' in that specification.

WebGLRenderingContext.deleteProgram() - Web APIs
the webglrenderingcontext.deleteprogram() method of the webgl api deletes a given webglprogram object.
... syntax void gl.deleteprogram(program); parameters program a webglprogram object to delete.
... examples deleting a program var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var program = gl.createprogram(); // ...
... gl.deleteprogram(program); specifications specification status comment webgl 1.0the definition of 'deleteprogram' in that specification.

WebGLRenderingContext.deleteRenderbuffer() - Web APIs
the webglrenderingcontext.deleterenderbuffer() method of the webgl api deletes a given webglrenderbuffer object.
... syntax void gl.deleterenderbuffer(renderbuffer); parameters renderbuffer a webglrenderbuffer object to delete.
... examples deleting a renderbuffer var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var renderbuffer = gl.createrenderbuffer(); // ...
... gl.deleterenderbuffer(renderbuffer); specifications specification status comment webgl 1.0the definition of 'deleterenderbuffer' in that specification.

WebGLRenderingContext.deleteShader() - Web APIs
the webglrenderingcontext.deleteshader() method of the webgl api marks a given webglshader object for deletion.
...this method has no effect if the shader has already been deleted, and the webglshader is automatically marked for deletion when it is destroyed by the garbage collector.
... syntax void gl.deleteshader(shader); parameters shader a webglshader object to delete.
... examples deleting a shader gl.deleteshader(shader); specifications specification status comment webgl 1.0the definition of 'deleteshader' in that specification.

WebGLRenderingContext.deleteTexture() - Web APIs
the webglrenderingcontext.deletetexture() method of the webgl api deletes a given webgltexture object.
... syntax void gl.deletetexture(texture); parameters texture a webgltexture object to delete.
... examples deleting a texture var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var texture = gl.createtexture(); // ...
... gl.deletetexture(texture); specifications specification status comment webgl 1.0the definition of 'deletetexture' in that specification.

WebGLRenderingContext.detachShader() - Web APIs
the webglrenderingcontext.detachshader() method of the webgl api detaches a previously attached webglshader from a webglprogram.
... syntax void gl.detachshader(program, shader); parameters program a webglprogram.
... shader a fragment or vertex webglshader.
... specifications specification status comment webgl 1.0the definition of 'detachshader' in that specification.

WebGLRenderingContext.generateMipmap() - Web APIs
the webglrenderingcontext.generatemipmap() method of the webgl api generates a set of mipmaps for a webgltexture object.
... when using a webgl 2 context, the following values are available additionally: gl.texture_3d: a three-dimensional texture.
... examples gl.generatemipmap(gl.texture_2d); specifications specification status comment webgl 1.0the definition of 'generatemipmap' in that specification.
... recommendation initial definition for webgl.

WebGLRenderingContext.getActiveAttrib() - Web APIs
the webglrenderingcontext.getactiveattrib() method of the webgl api returns a webglactiveinfo object containing size, type, and name of a vertex attribute.
... syntax webglactiveinfo gl.getactiveattrib(program,index); parameters program a webglprogram containing the vertex attribute.
... return value a webglactiveinfo object.
... examples const numattribs = gl.getprogramparameter(program, gl.active_attributes); for (let i = 0; i < numattribs; ++i) { const info = gl.getactiveattrib(program, i); console.log('name:', info.name, 'type:', info.type, 'size:', info.size); } specifications specification status comment webgl 1.0the definition of 'getactiveattrib' in that specification.

WebGLRenderingContext.getAttachedShaders() - Web APIs
the webglrenderingcontext.getattachedshaders() method of the webgl api returns a list of webglshader objects attached to a webglprogram.
... syntax sequence<webglshader> gl.getattachedshaders(program); parameters program a webglprogram object to get attached shaders for.
... return value an array of webglshader objects that are attached to the given webglprogram.
... examples var program = gl.createprogram(); // attach pre-existing shaders gl.attachshader(program, vertexshader); gl.attachshader(program, fragmentshader); gl.linkprogram(program); gl.getattachedshaders(program); specifications specification status comment webgl 1.0the definition of 'getattachedshaders' in that specification.

WebGLRenderingContext.getContextAttributes() - Web APIs
the webglrenderingcontext.getcontextattributes() method returns a webglcontextattributes object that contains the actual context parameters.
... syntax gl.getcontextattributes(); return value a webglcontextattributes object that contains the actual context parameters, or null if the context is lost.
... examples given this <canvas> element <canvas id="canvas"></canvas> and given this webgl context var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); gl.getcontextattributes(); the getcontextattributes method returns an object that describes the attributes set on this context, for example: { alpha: true, antialias: true, depth: true, failifmajorperformancecaveat: false, powerpreference: "default", premultipliedalpha: true, preservedrawingbuffer: false, stencil: false, desynchronized: false } the context attributes can be set when creating the context using the htmlcanvaselement.getcontext() method: canvas.getcontext('webgl', { antialias: false, depth: false }); see getcontext() for more informati...
... specifications specification status comment webgl 1.0the definition of 'webglrenderingcontext.getcontextattributes' in that specification.

WebGLRenderingContext.getShaderInfoLog() - Web APIs
the webglrenderingcontext.getshaderinfolog returns the information log for the specified webglshader object.
... syntax gl.getshaderinfolog(shader); parameters shader a webglshader to query.
...when a webglshader object is initially created, its information log will be a string of length 0.
...*/ gl.compileshader(shader); var message = gl.getshaderinfolog(shader); if (message.length > 0) { /* message may be an error or a warning */ throw message; } specifications specification status comment webgl 1.0the definition of 'getshaderinfolog' in that specification.

WebGLRenderingContext.getShaderPrecisionFormat() - Web APIs
the webglrenderingcontext.getshaderprecisionformat() method of the webgl api returns a new webglshaderprecisionformat object describing the range and precision for the specified shader numeric format.
... syntax webglshaderprecisionformat gl.getshaderprecisionformat(shadertype, precisiontype); parameters shadertype either a gl.fragment_shader or a gl.vertex_shader.
... return value a webglshaderprecisionformat object or null, if an error occurs.
... var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); gl.getshaderprecisionformat(gl.vertex_shader, gl.medium_float); // webglshaderprecisionformat { rangemin: 127, rangemax: 127, precision: 23 } specifications specification status comment webgl 1.0the definition of 'getshaderprecisionformat' in that specification.

WebGLRenderingContext.hint() - Web APIs
the webglrenderingcontext.hint() method of the webgl api specifies hints for certain behaviors.
...possible values: gl.generate_mipmap_hint: quality of filtering when generating mipmap images with webglrenderingcontext.generatemipmap().
... when using a webgl 2 context, the following values are available additionally: gl.fragment_shader_derivative_hint: same as ext.fragment_shader_derivative_hint_oes mode sets the behavior.
... gl.hint(gl.generate_mipmap_hint, gl.fastest); specifications specification status comment webgl 1.0the definition of 'hint' in that specification.

WebGLRenderingContext.isContextLost() - Web APIs
the webglrenderingcontext.iscontextlost() method returns a boolean indicating whether or not the webgl context has been lost and must be re-established before rendering can resume.
... usage notes there are several reasons why a webgl context may be lost, making it necessary to re-establish the context before resuming rendering.
...this would cause every webgl context to be lost throughout the entire browser.
... examples for example, when checking for program linking success, you could also check if the context is not lost: gl.linkprogram(program); if (!gl.getprogramparameter(program, gl.link_status) && !gl.iscontextlost()) { var info = gl.getprograminfolog(program); console.log('error linking program:\n' + info); } specifications specification status comment webgl 1.0the definition of 'webglrenderingcontext.iscontextlost' in that specification.

WebGLRenderingContext.isProgram() - Web APIs
the webglrenderingcontext.isprogram() method of the webgl api returns true if the passed webglprogram is valid, false otherwise.
... syntax glboolean gl.isprogram(program); parameters program a webglprogram to check.
... examples checking a program var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var program = gl.createprogram(); // ...
... gl.isprogram(program); specifications specification status comment webgl 1.0the definition of 'isprogram' in that specification.

WebGLRenderingContext.isShader() - Web APIs
the webglrenderingcontext.isshader() method of the webgl api returns true if the passed webglshader is valid, false otherwise.
... syntax glboolean gl.isshader(shader); parameters shader a webglshader to check.
... examples checking a shader var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var shader = gl.createshader(gl.vertex_shader); // ...
... gl.isshader(shader); specifications specification status comment webgl 1.0the definition of 'isshader' in that specification.

WebGLRenderingContext.lineWidth() - Web APIs
the webglrenderingcontext.linewidth() method of the webgl api sets the line width of rasterized lines.
... the webgl spec, based on the opengl es 2.0/3.0 specs points out that the minimum and maximum width for a line is implementation defined.
... as of january 2017 most implementations of webgl only support a minimum of 1 and a maximum of 1 as the technology they are based on has these same limits.
... gl.getparameter(gl.aliased_line_width_range); specifications specification status comment webgl 1.0the definition of 'linewidth' in that specification.

WebGLRenderingContext.linkProgram() - Web APIs
the webglrenderingcontext interface's linkprogram() method links a given webglprogram, completing the process of preparing the gpu code for the program's fragment and vertex shaders.
... syntax void gl.linkprogram(program); parameters program the webglprogram to link.
... examples var program = gl.createprogram(); // attach pre-existing shaders gl.attachshader(program, vertexshader); gl.attachshader(program, fragmentshader); gl.linkprogram(program); if ( !gl.getprogramparameter( program, gl.link_status) ) { var info = gl.getprograminfolog(program); throw new error('could not compile webgl program.
... \n\n' + info); } specifications specification status comment webgl 1.0the definition of 'linkprogram' in that specification.

WebGLRenderingContext.uniform[1234][fi][v]() - Web APIs
the webglrenderingcontext.uniform[1234][fi][v]() methods of the webgl api specify values of uniform variables.
... many of the functions described here have expanded webgl 2 interfaces, which can be found under webgl2renderingcontext.uniform[1234][uif][v]().
...on, v0, v1); void gl.uniform2iv(location, value); void gl.uniform3f(location, v0, v1, v2); void gl.uniform3fv(location, value); void gl.uniform3i(location, v0, v1, v2); void gl.uniform3iv(location, value); void gl.uniform4f(location, v0, v1, v2, v3); void gl.uniform4fv(location, value); void gl.uniform4i(location, v0, v1, v2, v3); void gl.uniform4iv(location, value); parameters location a webgluniformlocation object containing the location of the uniform attribute to modify.
... examples gl.uniform1f(u_alpha, 0.8); specifications specification status comment webgl 1.0the definition of 'uniform' in that specification.

WebGLRenderingContext.viewport() - Web APIs
the webglrenderingcontext.viewport() method of the webgl api sets the viewport, which specifies the affine transformation of x and y from normalized device coordinates to window coordinates.
... examples when you first create a webgl context, the size of the viewport will match the size of the canvas.
... however, if you resize the canvas, you will need to tell the webgl context a new viewport setting.
...int32array[0, 0, 640, 480] specifications specification status comment webgl 1.0the definition of 'viewport' in that specification.

WebGLSampler - Web APIs
the webglsampler interface is part of the webgl 2 api and stores sampling parameters for webgltexture access inside of a shader.
... when working with webglsampler objects, the following methods of the webgl2renderingcontext are useful: webgl2renderingcontext.createsampler() webgl2renderingcontext.deletesampler() webgl2renderingcontext.issampler() webgl2renderingcontext.bindsampler() webgl2renderingcontext.getsamplerparameter() examples creating a webglsampler object in this example, gl must be a webgl2renderingcontext.
... webglsampler objects are not available in webgl 1.
... var sampler = gl.createsampler(); specifications specification status comment webgl 2.0the definition of 'webglsample' in that specification.

WebGLSync - Web APIs
the webglsync interface is part of the webgl 2 api and is used to synchronize activities between the gpu and the application.
... when working with webglsync objects, the following methods of the webgl2renderingcontext are useful: webgl2renderingcontext.fencesync() webgl2renderingcontext.deletesync() webgl2renderingcontext.issync() webgl2renderingcontext.clientwaitsync() webgl2renderingcontext.waitsync() webgl2renderingcontext.getsyncparameter() examples creating a webglsync object in this example, gl must be a webgl2renderingcontext.
... webglsync objects are not available in webgl 1.
... var sync = gl.fencesync(gl.sync_gpu_commands_complete, 0); specifications specification status comment webgl 2.0the definition of 'webglsync' in that specification.

Canvas size and WebGL - Web APIs
« previousnext » this webgl example explores the effect of setting (or not setting) the canvas size to its element size in css pixels, as it appears in the browser window.
... effect of canvas size on rendering with webgl with scissor() and clear() we can demonstrate how the webgl drawing buffer is affected by the size of the canvas.
...ckground-color : black; } window.addeventlistener("load", function() { "use strict" var firstcanvas = document.getelementsbytagname("canvas")[0], secondcanvas = document.getelementsbytagname("canvas")[1]; firstcanvas.width = firstcanvas.clientwidth; firstcanvas.height = firstcanvas.clientheight; [firstcanvas, secondcanvas].foreach(function(canvas) { var gl = canvas.getcontext("webgl") || canvas.getcontext("experimental-webgl"); if (!gl) { document.queryselector("p").innerhtml = "failed to get webgl context.
... " + "your browser or device may not support webgl."; return; } gl.viewport(0, 0, gl.drawingbufferwidth, gl.drawingbufferheight); gl.enable(gl.scissor_test); gl.scissor(30, 10, 60, 60); gl.clearcolor(1.0, 1.0, 0.0, 1.0); gl.clear(gl.color_buffer_bit); }); }, false); the source code of this example is also available on github.

Using shaders to apply color in WebGL - Web APIs
applying color to the vertices in webgl objects are built using sets of vertices, each of which has a position and a color.
...to do this, we first need to create an array of vertex colors, then store it into a webgl buffer.
...then a new webgl buffer is allocated to store these colors, and the array is converted into floats and stored into the buffer.
... then, drawscene() can have the following added to it so it actually uses these colors when drawing the square: // tell webgl how to pull out the colors from the color buffer // into the vertexcolor attribute.

WebRTC coding guide - Web APIs
once you have an overall understanding of what webrtc does and how it works, your mind likely turns to implementation.
... how do you create a web application that uses two-way video or data streams without having to do all the hard work of compressing frames, building streams, and so forth by yourself?
... this coding guide will explain in depth how webrtc works, and will dive into actual code that uses webrtc to do useful things.
... if you need to learn more about the fundamentals of how webrtc and its protocols work, check out our high-level guides for webrtc.

Taking still photos with WebRTC - Web APIs
this article shows how to use webrtc to access the camera on a computer or mobile phone with webrtc support and take a photo with it.
... the first panel on the left contains two components: a <video> element, which will receive the stream from webrtc, and a <button> the user clicks to capture a video frame.
...this function's job is to request access to the user's webcam, initialize the output <img> to a default state, and to establish the event listeners needed to receive each frame of video from the camera and react when the button is clicked to capture an image.
... fun with filters since we're capturing images from the user's webcam by grabbing frames from a <video> element, we can very easily apply filters and fun effects to the video.

WebSocket() - Web APIs
the websocket() constructor returns a new websocket object.
... syntax var awebsocket = new websocket(url [, protocols]); parameters url the url to which to connect; this should be the url to which the websocket server will respond.
...these strings are used to indicate sub-protocols, so that a single server can implement multiple websocket sub-protocols (for example, you might want one server to be able to handle different types of interactions depending on the specified protocol).
... specifications specification status comment html living standardthe definition of 'the websocket constructor' in that specification.

Web Crypto API - Web APIs
the web crypto api is an interface allowing a script to use cryptographic primitives in order to build systems using cryptography.
... warning: the web crypto api provides a number of low-level cryptographic primitives.
...in order to avoid confusion, methods and properties of this interface have been removed from browsers implementing the web crypto api, and all web crypto api methods are available on a new interface: subtlecrypto.
... specifications specification status comment web cryptography api recommendation initial definition ...

XRWebGLLayerInit.alpha - Web APIs
the alpha property is a boolean value which, if present and set to true in the xrwebgllayerinit dictionary passed into the xrwebgllayer() constructor, specifies that the new layer's color buffer is to include an alpha channel.
... syntax let layerinit = { alpha: boolvalue }; let gllayer = new xrwebgllayer(xrsession, gl, layerinit); let gllayer = new xrwebgllayer(xrsession, gl, { alpha: boolvalue }); value a boolean which can be set to true to request that the new webgl layer for rendering the webxr scene is to have an alpha channel.
... example in this example, a new xrwebgllayer is created for a webxr session, xrsession, without an alpha channel.
... xrsession.updaterenderstate({ baselayer: new xrwebgllayer(xrsession, gl, { alpha: false }); }); specifications specification status comment webxr device apithe definition of 'xrwebgllayerinit.alpha' in that specification.

XRWebGLLayerInit.stencil - Web APIs
when using the xrwebgllayer() constructor to create a new webgl rendering layer for webxr, providing as the layerinit parameter an object whose stencil property is false requests that the new layer be created without a stencil buffer.
... syntax let layerinit = { stencil: false }; let gllayer = new xrwebgllayer(xrsession, gl, layerinit); let gllayer = new xrwebgllayer(xrsession, gl, { stencil: false }); value a boolean which can be set to false to specify that the new webgl layer should not include a stencil buffer.
... example in this example, a new xrwebgllayer is created for a webxr session, xrsession, without a stencil buffer.
... xrsession.updaterenderstate({ baselayer: new xrwebgllayer(xrsession, gl, { stencil: false }); }); specifications specification status comment webxr device apithe definition of 'xrwebgllayerinit.stencil' in that specification.

XRWebGLLayerInit - Web APIs
the webxr device api's xrwebgllayerinit dictionary is used to provide configuration options when creating a new xrwebgllayer object with the xrwebgllayer() constructor.
...the static xrwebgllayer function xrwebgllayer.getnativeframebufferscalefactor() returns the scale that would result in a 1:1 pixel ratio, thereby ensuring that the rendering is occurring at the device's native resolution.
... examples given an xrsession, xrsession, and a webgl rendering context, gl, this snippet sets the rendering layer for the session, specifying the ignoredepthvalues option, indicating that the depth buffer should not be used (or should not exist at all), and that the only source for distance information of any given point is its position relative to the viewer.
... const layeroptions = { ignoredepthvalues: true }; xrsession.updaterenderstate({ baselayer: new xrwebgllayer(xrsession, gl, layeroptions); }); specifications specification status comment webxr device apithe definition of 'xrwebgllayerinit' in that specification.

Handling media support issues in web content - Web media technologies
one of the realities of working with audio and video presentation and manipulation on the web is that there are a number of media formats available, of varying degrees of popularity and with a variety of capabilities.
...there is a drawback, however: because there are so many to choose from, with so many different kinds of licenses and design principles involved, each web browser developer is left to its own devices when deciding which media file types and codecs to support.
... this places a small, but reasonably easily overcome, burden on the web developer: to properly handle the situation when the user's browser can't handle a particular type of media.
... this guide covers techniques you can use to develop web content that meets your media needs while providing the most broadly compatible experience possible.

Ajax - MDN Web Docs Glossary: Definitions of Web-related terms
ajax, which initially stood for asynchronous javascript and xml, is a programming practice of building complex, dynamic webpages using a technology known as xmlhttprequest.
...ajax also lets you work asynchronously, meaning your code continues to run while the targeted part of your web page is trying to reload (compared to synchronously, which blocks your code from running until that part of your page is done reloading).
... with interactive websites and modern web standards, ajax is gradually being replaced by functions within javascript frameworks and the official fetch api standard.

Accessibility - MDN Web Docs Glossary: Definitions of Web-related terms
web accessibility (a11y) refers to best practices for keeping a website usable despite physical and technical restrictions.
... web accessibility is formally defined and discussed at the w3c through the web accessibility initiative (wai).
... learn more general knowledge accessibility resources at mdn web accessibility on wikipedia learn web accessibility learn accessibility on mdn web accessibility in mind technical reference the aria documentation on mdn the web accessibility initiative homepage the wai-aria recommendation ...

Apple Safari - MDN Web Docs Glossary: Definitions of Web-related terms
safari is a web browser developed by apple and bundled with both macos and ios.
... it's based on the open source webkit engine.
... learn more general knowledge safari on wikipedia safari on apple.com technical information the webkit project webkit nightly build reporting a bug for safari ...

Cross-site scripting - MDN Web Docs Glossary: Definitions of Web-related terms
cross-site scripting (xss) is a security exploit which allows an attacker to inject into a website malicious client-side code.
...according to the open web application security project, xss was the seventh most common web app vulnerability in 2017.
... these attacks succeed if the web app does not employ enough validation or encoding.

Global object - MDN Web Docs Glossary: Definitions of Web-related terms
in a web browser, when scripts create global variables, they're created as members of the global object.
...for example: in a web browser, any code which the script doesn't specifically start up as a background task has a window as its global object.
... this is the vast majority of javascript code on the web.

Google Chrome - MDN Web Docs Glossary: Definitions of Web-related terms
google chrome is a free web browser developed by google.
...note that the ios version of chrome uses that platform's webview, not blink.
... android ios desktop for web developers if you want to try the latest chrome features, install one of the pre-stable builds.

HTTP - MDN Web Docs Glossary: Definitions of Web-related terms
the hypertext transfer protocol (http) is the underlying network protocol that enables transfer of hypermedia documents on the web, typically between a browser and a server so that humans can read them.
...this property makes it ideal for humans to read documents (web sites) on the world wide web.
... however, http can also be used as a basis for rest web services from server to server or ajax requests within web sites to make them more dynamic.

JavaScript - MDN Web Docs Glossary: Definitions of Web-related terms
summary javascript (or "js") is a programming language used most often for dynamic client-side scripts on webpages, but it is also often used on the server-side, using a runtime such as node.js.
... javascript is primarily used in the browser, enabling developers to manipulate webpage content through the dom, manipulate data with ajax and indexeddb, draw graphics with canvas, interact with the device running the browser through various apis, and more.
...node.js - built using chrome's v8 javascript engine - allows developers to use javascript as a scripting language to automate things on a computer and build fully functional http and web sockets servers.

Keyword - MDN Web Docs Glossary: Definitions of Web-related terms
online keywords are used as queries for search engines or as words identifying content on websites.
... when you use a search engine, you use keywords to specify what you are looking for, and the search engine returns relevant webpages.
... webpages also use keywords in a meta tag (in the <head> section) to describe page content, so search engines can better identify and organize webpages.

MVC - MDN Web Docs Glossary: Definitions of Web-related terms
mvc on the web as a web developer, this pattern will probably be quite familiar even if you've never consciously used it before.
... in the early days of the web, mvc architecture was mostly implemented on the server-side, with the client requesting updates via forms or links, and receiving updated views back to display in the browser.
... web frameworks such as angularjs and ember.js all implement an mvc architecture, albeit in slightly different ways.

Network throttling - MDN Web Docs Glossary: Definitions of Web-related terms
in web performance, network throttling, or network condition emulation, it is used to emulate low bandwidth conditions experienced by likely a large segment of a site's target user base.
...the internet speeds for developers creating web applications in a corporate office building on a powerful computer are generally very fast.
...the network speeds of a mobile user accessing that web application, possibly while traveling or in a remote area with poor data plan covereage, will likely be very slow, if they are able to get online at all.

SQL Injection - MDN Web Docs Glossary: Definitions of Web-related terms
sql injection takes advantage of web apps that fail to validate user input.
... hackers can maliciously pass sql commands through the web app for execution by a backend database.
... learn more general knowledge sql injection on wikipedia explanation of sql injection on owasp (open web application security project) ...

Thread - MDN Web Docs Glossary: Definitions of Web-related terms
the main thread is the one used by the browser to handle user events, render and paint the display, and to run the majority of the code that comprises a typical web page or app.
... because these things are all happening in one thread, a slow website or app script slows down the entire browser; worse, if a site or app script enters an infinite loop, the entire browser will hang.
...this is done using technologies such as web workers, which can be used to spin off a sub-program which runs concurrently with the main thread in a thread of its own.

Time to interactive - MDN Web Docs Glossary: Definitions of Web-related terms
time to interactive (tti) is a non-standardized web performance 'progress' metric defined as the point in time when the last long task finished and was followed by 5 seconds of network and main thread inactivity.
... tti, proposed by the web incubator community group in 2018, is intended to provide a metric that describes when a page or application contains useful content and the main thread is idle and free to respond to user interactions, including having event handlers registered.
...although available in some performance monitoring tools, tti is not a part of any official web specification at the time of writing.

W3C - MDN Web Docs Glossary: Definitions of Web-related terms
the world wide web consortium (w3c) is an international body that maintains web-related rules and frameworks.
... it consists of over 350 member-organizations that jointly develop web standards, run outreach programs, and maintain an open forum for talking about the web.
... learn more general knowledge w3c website w3c on wikipedia ...

Safe - MDN Web Docs Glossary: Definitions of Web-related terms
web crawlers also rely on calling safe methods.
... safe methods don't need to serve static files only; a server can generate an answer to a safe method on-the-fly, as long as the generating script guarantees safety: it should not trigger external effects, like triggering an order in an e-commerce web site.
... it is the responsibility of the application on the server to implement the safe semantic correctly, the webserver itself, being apache, nginx or iis, can't enforce it by itself.

Element: webkitmouseforcewillbegin event - Web APIs
safari for macos fires the non-standard webkitmouseforcewillbegin event at an element before firing the initial mousedown event.
... to instruct macos not to engage any default force touch actions if the user apply enough pressure to activate a force touch event, call preventdefault() on the webkitmouseforcewillbegin event object.
... bubbles unknown cancelable unknown interface mouseevent webkitmouseforcewillbegin is a proprietary, webkit-specific event.

HTMLCanvasElement: webglcontextcreationerror event - Web APIs
the webglcontextcreationerror event of the webgl api is fired if the user agent is unable to create a webglrenderingcontext context.
... this event has a webglcontextevent.statusmessage property, which can contain a platform dependent string with more information about the failure.
... bubbles yes cancelable yes interface webglcontextevent event handler property none example var canvas = document.getelementbyid('canvas'); canvas.addeventlistener('webglcontextcreationerror', function(e) { console.log(e.statusmessage || 'unknown error'); }, false); var gl = canvas.getcontext('webgl'); // logs statusmessage or "unknown error" if unable to create webgl context specifications specification status comment webgl 1.0the definition of 'webglcontextcreationerror' in that specification.

HTMLCanvasElement: webglcontextlost event - Web APIs
the webglcontextlost event of the webgl api is fired if the user agent detects that the drawing buffer associated with a webglrenderingcontext object has been lost.
... bubbles yes cancelable yes interface webglcontextevent event handler property none example with the help of the webgl_lose_context extension, you can simulate the webglcontextlost event: const canvas = document.getelementbyid('canvas'); const gl = canvas.getcontext('webgl'); canvas.addeventlistener('webglcontextlost', (event) => { console.log(event); }); gl.getextension('webgl_lose_context').losecontext(); // "webglcontextlost" event is logged.
... specifications specification status comment webgl 1.0the definition of 'webglcontextlost' in that specification.

MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN - Web APIs
do not use it on production sites facing the web: it will not work for every user.
... mouseevent.webkit_force_at_force_mouse_down is a proprietary, webkit-specific, static numeric property whose value is the minimum force necessary for a force click.
... because webkit_force_at_force_mouse_down is a static property of mouseevent, you always use it as mouseevent.webkit_force_at_force_mouse_down, rather than as a property of a mouseevent instance.

MouseEvent.WEBKIT_FORCE_AT_MOUSE_DOWN - Web APIs
do not use it on production sites facing the web: it will not work for every user.
... mouseevent.webkit_force_at_mouse_down is a proprietary, webkit-specific, static numeric property whose value is the minimum force necessary for a normal click.
... because webkit_force_at_mouse_down is a static property of mouseevent, you always use it as mouseevent.webkit_force_at_mouse_down, rather than as a property of a mouseevent instance.

WEBGL_lose_context.restoreContext() - Web APIs
the webgl_lose_context.restorecontext() method is part of the webgl api and allows you to simulate restoring the context of a webglrenderingcontext object.
... syntax gl.getextension('webgl_lose_context').restorecontext(); errors thrown invalid_operation if the context was not lost.
... examples with this method, you can simulate the webglcontextrestored event: var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); canvas.addeventlistener('webglcontextrestored', function(e) { console.log(e); }, false); gl.getextension('webgl_lose_context').restorecontext(); specifications specification status comment webgl_lose_contextthe definition of 'webgl_lose_context.losecontext' in that specification.

WebGL2RenderingContext.beginQuery() - Web APIs
the webgl2renderingcontext.beginquery() method of the webgl 2 api starts an asynchronous query.
... query a webglquery object for which to start the querying.
... specifications specification status comment webgl 2.0the definition of 'beginquery' in that specification.

WebGL2RenderingContext.beginTransformFeedback() - Web APIs
the webgl2renderingcontext.begintransformfeedback() method of the webgl 2 api starts a transform feedback operation.
... examples var transformfeedback = gl.createtransformfeedback(); gl.bindtransformfeedback(gl.transform_feedback, transformfeedback); gl.begintransformfeedback(gl.triangles); gl.drawarrays(gl.triangles, 0, 3); specifications specification status comment webgl 2.0the definition of 'begintransformfeedback' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.bindSampler() - Web APIs
the webgl2renderingcontext.bindsampler() method of the webgl 2 api binds a passed webglsampler object to the texture unit at the passed index.
... sampler a webglsampler object to bind.
... examples var sampler = gl.createsampler(); gl.bindsampler(0, sampler); specifications specification status comment webgl 2.0the definition of 'bindsampler' in that specification.

WebGL2RenderingContext.bindVertexArray() - Web APIs
the webgl2renderingcontext.bindvertexarray() method of the webgl 2 api binds a passed webglvertexarrayobject object to the buffer.
... syntax void gl.bindvertexarray(vertexarray); parameters vertexarray a webglvertexarrayobject (vao) object to bind.
... specifications specification status comment webgl 2.0the definition of 'bindvertexarray' in that specification.

WebGL2RenderingContext.blitFramebuffer() - Web APIs
the webgl2renderingcontext.blitframebuffer() method of the webgl 2 api transfers a block of pixels from the read framebuffer to the draw framebuffer.
... examples gl.blitframebuffer(0, 0, canvas.width, canvas.height, 0, 0, canvas.width, canvas.height, gl.color_buffer_bit, gl.nearest); specifications specification status comment webgl 2.0the definition of 'blitframebuffer' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.clearBuffer[fiuv]() - Web APIs
the webgl2renderingcontext.clearbuffer[fiuv]() methods of the webgl 2 api clear buffers from the currently bound framebuffer.
... examples gl.clearbufferiv(gl.color, 0, new int32array([r, g, b, a])); gl.clearbufferuiv(gl.color, 0, new uint32array([r, g, b, a])); gl.clearbufferfv(gl.color, 0, new float32array([r, g, b, a])); gl.clearbufferfv(gl.color, 0, [0.0, 0.0, 0.0, 0.0]); gl.clearbufferfi(gl.depth_stencil, 0, 1.0, 0); specifications specification status comment webgl 2.0the definition of 'clearbuffer[fiuv]()' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.compressedTexSubImage3D() - Web APIs
the webgl2renderingcontext.compressedtexsubimage3d() method of the webgl api specifies a three-dimensional sub-rectangle for a texture image in a compressed format.
... examples gl.compressedtexsubimage3d(gl.texture_3d, 0, 0, 0, 512, 512, 512, gl.compressed_r11_eac, texturedata); specifications specification status comment webgl 2.0the definition of 'compressedtexsubimage3d' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.copyBufferSubData() - Web APIs
the webgl2renderingcontext.copybuffersubdata() method of the webgl 2 api copies part of the data of a buffer to another buffer.
...uffer(gl.array_buffer, srcbuffer); gl.bufferdata(gl.array_buffer, data, gl.static_draw); gl.bindbuffer(gl.copy_read_buffer, srcbuffer); gl.bindbuffer(gl.array_buffer, dstbuffer); gl.bufferdata(gl.array_buffer, new float32array(length), gl.static_draw); gl.copybuffersubdata(gl.copy_read_buffer, gl.array_buffer, 0, 0, length); specifications specification status comment webgl 2.0the definition of 'copybuffersubdata' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.deleteVertexArray() - Web APIs
the webgl2renderingcontext.deletevertexarray() method of the webgl 2 api deletes a given webglvertexarrayobject object.
... syntax void gl.deletevertexarray(vertexarray); parameters vertexarray a webglvertexarrayobject (vao) object to delete.
... gl.deletevertexarray(vao); specifications specification status comment webgl 2.0the definition of 'deletevertexarray' in that specification.

WebGL2RenderingContext.drawBuffers() - Web APIs
the webgl2renderingcontext.drawbuffers() method of the webgl 2 api defines draw buffers to which fragment colors are written into.
... examples gl.drawbuffers([gl.none, gl.color_attachment1]); specifications specification status comment webgl 2.0the definition of 'drawbuffers' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.drawRangeElements() - Web APIs
the webgl2renderingcontext.drawrangeelements() method of the webgl api renders primitives from array data in a given range.
... examples gl.drawrangeelements(gl.points, 0, 7, 8, gl.unsigned_byte, 0); specifications specification status comment webgl 2.0the definition of 'drawrangeelements' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.endTransformFeedback() - Web APIs
the webgl2renderingcontext.endtransformfeedback() method of the webgl 2 api ends a transform feedback operation.
... examples var transformfeedback = gl.createtransformfeedback(); gl.bindtransformfeedback(gl.transform_feedback, transformfeedback); gl.begintransformfeedback(gl.triangles); gl.drawarrays(gl.triangles, 0, 3); gl.endtransformfeedback(); specifications specification status comment webgl 2.0the definition of 'endtransformfeedback' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.getFragDataLocation() - Web APIs
the webgl2renderingcontext.getfragdatalocation() method of the webgl 2 api returns the binding of color numbers to user-defined varying out variables.
... syntax glint gl.getfragdatalocation(program, name); parameters program a webglprogram to query.
... examples // program is a linked webglprogram gl.getfragdatalocation(program, 'fragcolor'); specifications specification status comment webgl 2.0the definition of 'getfragdatalocation' in that specification.

WebGL2RenderingContext.getInternalformatParameter() - Web APIs
the webgl2renderingcontext.getinternalformatparameter() method of the webgl 2 api returns information about implementation-dependent support for internal formats.
... examples var samples = gl.getinternalformatparameter(gl.renderbuffer, gl.rgba8, gl.samples); specifications specification status comment webgl 2.0the definition of 'getinternalformatparameter' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.getQueryParameter() - Web APIs
the webgl2renderingcontext.getqueryparameter() method of the webgl 2 api returns parameter information of a webglquery object.
... syntax any gl.getqueryparameter(query, pname); parameters query a webglquery object.
... examples var query = gl.createquery(); gl.beginquery(gl.any_samples_passed, query); var result = gl.getqueryparameter(query, gl.query_result); specifications specification status comment webgl 2.0the definition of 'getqueryparameter' in that specification.

WebGL2RenderingContext.getSamplerParameter() - Web APIs
the webgl2renderingcontext.getsamplerparameter() method of the webgl 2 api returns parameter information of a webglsampler object.
... syntax any gl.getsamplerparameter(sampler, pname); parameters sampler a webglsampler object.
... examples var sampler = gl.createsampler(); gl.getsamplerparameter(sampler, gl.texture_compare_func); specifications specification status comment webgl 2.0the definition of 'getsamplerparameter' in that specification.

WebGL2RenderingContext.invalidateFramebuffer() - Web APIs
the webgl2renderingcontext.invalidateframebuffer() method of the webgl 2 api invalidates the contents of attachments in a framebuffer.
... examples gl.invalidateframebuffer(gl.read_framebuffer, [gl.color_attachment0, gl.color_attachment1]); specifications specification status comment webgl 2.0the definition of 'invalidateframebuffer' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.invalidateSubFramebuffer() - Web APIs
the webgl2renderingcontext.invalidatesubframebuffer() method of the webgl 2 api invalidates portions of the contents of attachments in a framebuffer.
... examples gl.invalidatesubframebuffer(gl.read_framebuffer, [gl.color_attachment0, gl.color_attachment1], 0, 0, 256, 256); specifications specification status comment webgl 2.0the definition of 'invalidatesubframebuffer' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.pauseTransformFeedback() - Web APIs
the webgl2renderingcontext.pausetransformfeedback() method of the webgl 2 api pauses a transform feedback operation.
...gl.resumetransformfeedback(); gl.drawarrays(gl.triangles, 0, 3); gl.endtransformfeedback(); specifications specification status comment webgl 2.0the definition of 'pausetransformfeedback' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.readBuffer() - Web APIs
the webgl2renderingcontext.readbuffer() method of the webgl 2 api selects a color buffer as the source for pixels for subsequent calls to copyteximage2d, copytexsubimage2d, copytexsubimage3d or readpixels.
... examples gl.readbuffer(gl.color_attachment0); specifications specification status comment webgl 2.0the definition of 'readbuffer' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.renderbufferStorageMultisample() - Web APIs
the webgl2renderingcontext.renderbufferstoragemultisample() method of the webgl 2 api returns creates and initializes a renderbuffer object's data store and allows specifying a number of samples to be used.
... examples gl.renderbufferstoragemultisample(gl.renderbuffer, 4, gl.rbga4, 256, 256); specifications specification status comment webgl 2.0the definition of 'glrenderbufferstoragemultisample' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.resumeTransformFeedback() - Web APIs
the webgl2renderingcontext.resumetransformfeedback() method of the webgl 2 api resumes a transform feedback operation.
...gl.resumetransformfeedback(); gl.drawarrays(gl.triangles, 0, 3); gl.endtransformfeedback(); specifications specification status comment webgl 2.0the definition of 'resumetransformfeedback' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.texStorage3D() - Web APIs
the webgl2renderingcontext.texstorage3d() method of the webgl api specifies all levels of a three-dimensional texture or two-dimensional array texture.
... examples gl.texstorage3d(gl.texture_3d, 1, gl.rgb8, 256, 256, 256); specifications specification status comment webgl 2.0the definition of 'texstorage3d' in that specification.
... editor's draft initial definition for webgl.

WebGL2RenderingContext.vertexAttribI4[u]i[v]() - Web APIs
the webgl2renderingcontext.vertexattribi4[u]i[v]() methods of the webgl 2 api specify integer values for generic vertex attributes.
... examples gl.vertexattribi4i(a_foobar, 10); specifications specification status comment webgl 2.0the definition of 'vertexattribi' in that specification.
... editor's draft initial definition for webgl.

WebGLBuffer - Web APIs
the webglbuffer interface is part of the webgl api and represents an opaque buffer object storing data such as vertices or colors.
... description the webglbuffer object does not define any methods or properties of its own and its content is not directly accessible.
... when working with webglbuffer objects, the following methods of the webglrenderingcontext are useful: webglrenderingcontext.bindbuffer() webglrenderingcontext.createbuffer() webglrenderingcontext.deletebuffer() webglrenderingcontext.isbuffer() examples creating a buffer var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var buffer = gl.createbuffer(); specifications specification status comment webgl 1.0the definition of 'webglbuffer' in that specification.

WebGLContextEvent.statusMessage - Web APIs
the read-only webglcontextevent.statusmessage property contains additional event status information, or is an empty string if no additional information is available.
...this can occur, for example, if the webglcontextcreationerror event is fired.
... var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); canvas.addeventlistener('webglcontextcreationerror', function(e) { console.log('webgl context creation failed:' + e.statusmessage || 'unknown error'); }, false); specifications specification status comment webgl 1.0the definition of 'webglcontextevent.statusmessage' in that specification.

WebGLFramebuffer - Web APIs
the webglframebuffer interface is part of the webgl api and represents a collection of buffers that serve as a rendering destination.
... description the webglframebuffer object does not define any methods or properties of its own and its content is not directly accessible.
... when working with webglframebuffer objects, the following methods of the webglrenderingcontext are useful: webglrenderingcontext.bindframebuffer() webglrenderingcontext.createframebuffer() webglrenderingcontext.deleteframebuffer() webglrenderingcontext.isframebuffer() examples creating a frame buffer var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var buffer = gl.createframebuffer(); specifications specification status comment webgl 1.0the definition of 'webglframebuffer' in that specification.

WebGLRenderbuffer - Web APIs
the webglrenderbuffer interface is part of the webgl api and represents a buffer that can contain an image, or can be source or target of an rendering operation.
... description the webglrenderbuffer object does not define any methods or properties of its own and its content is not directly accessible.
... when working with webglrenderbuffer objects, the following methods of the webglrenderingcontext are useful: webglrenderingcontext.bindrenderbuffer() webglrenderingcontext.createrenderbuffer() webglrenderingcontext.deleterenderbuffer() webglrenderingcontext.isrenderbuffer() examples creating a render buffer var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var buffer = gl.createrenderbuffer(); specifications specification status comment webgl 1.0the definition of 'webglrenderbuffer' in that specification.

WebGLRenderingContext.canvas - Web APIs
the webglrenderingcontext.canvas property is a read-only reference to the htmlcanvaselement or offscreencanvas object that is associated with the context.
... examples canvas element given this <canvas> element: <canvas id="canvas"></canvas> you can get back a reference to it from the webglrenderingcontext using the canvas property: var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); gl.canvas; // htmlcanvaselement offscreen canvas example using the experimental offscreencanvas object.
... var offscreen = new offscreencanvas(256, 256); var gl = offscreen.getcontext('webgl'); gl.canvas; // offscreencanvas specifications specification status comment webgl 1.0the definition of 'webglrenderingcontext.canvas' in that specification.

WebGLRenderingContext.compileShader() - Web APIs
the webglrenderingcontext.compileshader() method of the webgl api compiles a glsl shader into binary data so that it can be used by a webglprogram.
... syntax void gl.compileshader(shader); parameters shader a fragment or vertex webglshader.
... examples var shader = gl.createshader(gl.vertex_shader); gl.shadersource(shader, shadersource); gl.compileshader(shader); specifications specification status comment webgl 1.0the definition of 'compileshader' in that specification.

WebGLRenderingContext.createShader() - Web APIs
the webglrenderingcontext method createshader() of the webgl api creates a webglshader that can then be configured further using webglrenderingcontext.shadersource() and webglrenderingcontext.compileshader().
... syntax webglshader gl.createshader(type); parameters type either gl.vertex_shader or gl.fragment_shader examples see webglshader for usage and examples.
... specifications specification status comment webgl 1.0the definition of 'createshader' in that specification.

WebGLRenderingContext.depthRange() - Web APIs
the webglrenderingcontext.depthrange() method of the webgl api specifies the depth range mapping from normalized device coordinates to window or viewport coordinates.
... examples gl.depthrange(0.2, 0.6); to check the current depth range, query the depth_range constant which returns a float32array gl.getparameter(gl.depth_range); // float32array[0.2, 0.6] specifications specification status comment webgl 1.0the definition of 'depthrange' in that specification.
...unlike opengl, webgl requires znear and zfar values to be clamped to the range 0 to 1.

WebGLRenderingContext.getAttribLocation() - Web APIs
the webglrenderingcontext.getattriblocation() method of the webgl api returns the location of an attribute variable in a given webglprogram.
... syntax glint gl.getattriblocation(program, name); parameters program a webglprogram containing the attribute variable.
... examples gl.getattriblocation(program, 'vcolor'); specifications specification status comment webgl 1.0the definition of 'getattriblocation' in that specification.

WebGLRenderingContext.getError() - Web APIs
the webglrenderingcontext.geterror() method of the webgl api returns error information.
... gl.context_lost_webgl if the webgl context is lost, this error is returned on the first call to geterror.
... examples gl.geterror(); // gl.no_error (0) gl.enable(gl.foobar); gl.geterror(); // gl.invalid_enum; specifications specification status comment webgl 1.0the definition of 'geterror' in that specification.

WebGLRenderingContext.getShaderParameter() - Web APIs
the webglrenderingcontext.getshaderparameter() method of the webgl api returns information about the given shader.
... syntax any gl.getshaderparameter(shader, pname); parameters shader a webglshader to get parameter information from.
... examples gl.getshaderparameter(shader, gl.shader_type); specifications specification status comment webgl 1.0the definition of 'getshaderparameter' in that specification.

WebGLRenderingContext.getShaderSource() - Web APIs
the webglrenderingcontext.getshadersource() method of the webgl api returns the source code of a webglshader as a domstring.
... syntax domstring gl.getshadersource(shader); parameters shader a webglshader object to get the source code from.
... examples var shader = gl.createshader(gl.vertex_shader); gl.shadersource(shader, originalsource); var source = gl.getshadersource(shader); specifications specification status comment webgl 1.0the definition of 'getshadersource' in that specification.

WebGLRenderingContext.isBuffer() - Web APIs
the webglrenderingcontext.isbuffer() method of the webgl api returns true if the passed webglbuffer is valid and false otherwise.
... syntax glboolean gl.isbuffer(buffer); parameters buffer a webglbuffer to check.
... examples creating a buffer var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var buffer = gl.createbuffer(); gl.isbuffer(buffer); specifications specification status comment webgl 1.0the definition of 'isbuffer' in that specification.

WebGLRenderingContext.isFramebuffer() - Web APIs
the webglrenderingcontext.isframebuffer() method of the webgl api returns true if the passed webglframebuffer is valid and false otherwise.
... syntax glboolean gl.isframebuffer(framebuffer); parameters framebuffer a webglframebuffer to check.
... examples checking a frame buffer var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var framebuffer = gl.createframebuffer(); gl.isframebuffer(framebuffer); specifications specification status comment webgl 1.0the definition of 'isframebuffer' in that specification.

WebGLRenderingContext.isRenderbuffer() - Web APIs
the webglrenderingcontext.isrenderbuffer() method of the webgl api returns true if the passed webglrenderbuffer is valid and false otherwise.
... syntax glboolean gl.isrenderbuffer(renderbuffer); parameters renderbuffer a webglrenderbuffer to check.
... examples checking a renderbuffer var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var renderbuffer = gl.createrenderbuffer(); gl.isrenderbuffer(renderbuffer); specifications specification status comment webgl 1.0the definition of 'isrenderbuffer' in that specification.

WebGLRenderingContext.isTexture() - Web APIs
the webglrenderingcontext.istexture() method of the webgl api returns true if the passed webgltexture is valid and false otherwise.
... syntax glboolean gl.istexture(texture); parameters texture a webgltexture to check.
... examples checking a texture var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var texture = gl.createtexture(); gl.istexture(texture); specifications specification status comment webgl 1.0the definition of 'istexture' in that specification.

WebGLRenderingContext.shaderSource() - Web APIs
the webglrenderingcontext.shadersource() method of the webgl api sets the source code of a webglshader.
... syntax void gl.shadersource(shader, source); parameters shader a webglshader object in which to set the source code.
... examples var shader = gl.createshader(gl.vertex_shader); gl.shadersource(shader, originalsource); var source = gl.getshadersource(shader); specifications specification status comment webgl 1.0the definition of 'shadersource' in that specification.

WebGLRenderingContext.stencilMask() - Web APIs
the webglrenderingcontext.stencilmask() method of the webgl api controls enabling and disabling of both the front and back writing of individual bits in the stencil planes.
... the webglrenderingcontext.stencilmaskseparate() method can set front and back stencil writemasks to different values.
... gl.getparameter(gl.stencil_writemask); // 110101 gl.getparameter(gl.stencil_back_writemask); // 110101 gl.getparameter(gl.stencil_bits); // 0 specifications specification status comment webgl 1.0the definition of 'stencilmask' in that specification.

WebGLRenderingContext.stencilMaskSeparate() - Web APIs
the webglrenderingcontext.stencilmaskseparate() method of the webgl api controls enabling and disabling of front and/or back writing of individual bits in the stencil planes.
... the webglrenderingcontext.stencilmask() method can set both, the front and back stencil writemasks to one value at the same time.
... gl.getparameter(gl.stencil_writemask); // 110101 gl.getparameter(gl.stencil_back_writemask); // 110101 gl.getparameter(gl.stencil_bits); // 0 specifications specification status comment webgl 1.0the definition of 'stencilmaskseparate' in that specification.

WebGLRenderingContext.stencilOp() - Web APIs
the webglrenderingcontext.stencilop() method of the webgl api sets both the front and back-facing stencil test actions.
... gl.replace sets the stencil buffer value to the reference value as specified by webglrenderingcontext.stencilfunc().
... gl.getparameter(gl.stencil_fail); gl.getparameter(gl.stencil_pass_depth_pass); gl.getparameter(gl.stencil_pass_depth_fail); gl.getparameter(gl.stencil_back_fail); gl.getparameter(gl.stencil_back_pass_depth_pass); gl.getparameter(gl.stencil_back_pass_depth_fail); gl.getparameter(gl.stencil_bits); specifications specification status comment webgl 1.0the definition of 'stencilop' in that specification.

WebGLRenderingContext.stencilOpSeparate() - Web APIs
the webglrenderingcontext.stencilopseparate() method of the webgl api sets the front and/or back-facing stencil test actions.
... gl.replace sets the stencil buffer value to the reference value as specified by webglrenderingcontext.stencilfunc().
... gl.getparameter(gl.stencil_fail); gl.getparameter(gl.stencil_pass_depth_pass); gl.getparameter(gl.stencil_pass_depth_fail); gl.getparameter(gl.stencil_back_fail); gl.getparameter(gl.stencil_back_pass_depth_pass); gl.getparameter(gl.stencil_back_pass_depth_fail); gl.getparameter(gl.stencil_bits); specifications specification status comment webgl 1.0the definition of 'stencilopseparate' in that specification.

WebGLRenderingContext.uniformMatrix[234]fv() - Web APIs
the webglrenderingcontext.uniformmatrix[234]fv() methods of the webgl api specify matrix values for uniform variables.
... syntax webglrenderingcontext.uniformmatrix2fv(location, transpose, value); webglrenderingcontext.uniformmatrix3fv(location, transpose, value); webglrenderingcontext.uniformmatrix4fv(location, transpose, value); parameters location a webgluniformlocation object containing the location of the uniform attribute to modify.
... return value undefined examples gl.uniformmatrix2fv(loc, false, [2,1, 2,2]); specifications specification status comment webgl 1.0the definition of 'uniformmatrix' in that specification.

WebGLRenderingContext.useProgram() - Web APIs
the webglrenderingcontext.useprogram() method of the webgl api sets the specified webglprogram as part of the current rendering state.
... syntax void gl.useprogram(program); parameters program a webglprogram to use.
... examples var program = gl.createprogram(); // attach pre-existing shaders gl.attachshader(program, vertexshader); gl.attachshader(program, fragmentshader); gl.linkprogram(program); gl.useprogram(program); specifications specification status comment webgl 1.0the definition of 'useprogram' in that specification.

WebGLTexture - Web APIs
the webgltexture interface is part of the webgl api and represents an opaque texture object providing storage and state for texturing operations.
... description the webgltexture object does not define any methods or properties of its own and its content is not directly accessible.
... when working with webgltexture objects, the following methods of the webglrenderingcontext are useful: webglrenderingcontext.bindtexture() webglrenderingcontext.createtexture() webglrenderingcontext.deletetexture() webglrenderingcontext.istexture() examples creating a texture var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var texture = gl.createtexture(); specifications specification status comment webgl 1.0the definition of 'webgltexture' in that specification.

WebGLUniformLocation - Web APIs
the webgluniformlocation interface is part of the webgl api and represents the location of a uniform variable in a shader program.
... description the webgluniformlocation object does not define any methods or properties of its own and its content is not directly accessible.
... when working with webgluniformlocation objects, the following methods of the webglrenderingcontext are useful: webglrenderingcontext.getuniformlocation() webglrenderingcontext.uniform() examples getting an uniform location var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var location = gl.getuniformlocation(webglprogram, 'uniformname'); specifications specification status comment webgl 1.0the definition of 'webgluniformlocation' in that specification.

WebGLVertexArrayObject - Web APIs
the webglvertexarrayobject interface is part of the webgl 2 api, represents vertex array objects (vaos) pointing to vertex array data, and provides names for different sets of vertex data.
... when working with webglvertexarrayobject objects, the following methods are useful: webgl2renderingcontext.createvertexarray() webgl2renderingcontext.deletevertexarray() webgl2renderingcontext.isvertexarray() webgl2renderingcontext.bindvertexarray() webgl 1: the oes_vertex_array_object extension allows you to use vertex array objects in a webgl 1 context.
... specifications specification status comment webgl 2.0the definition of 'webglvertexarrayobject' in that specification.

Lighting in WebGL - Web APIs
« previousnext » as should be clear by now, webgl doesn't have much built-in knowledge.
...instead of discussing it in depth here, take a look at the article on phong shading at wikipedia, which provides a good overview of the most commonly used lighting model or if you'd like to see a webgl based explanation see this artcle.
... then we add the code to drawscene() to bind the normals array to a shader attribute so the shader code can get access to it: // tell webgl how to pull out the normals from // the normal buffer into the vertexnormal attribute.

WebSocket.binaryType - Web APIs
the websocket.binarytype property returns the type of binary data being transmitted by the connection.
... syntax var binarytype = awebsocket.binarytype; value a domstring: "blob" if blob objects are used.
... specifications specification status comment html living standardthe definition of 'websocket: binarytype' in that specification.

WebSocket.bufferedAmount - Web APIs
the websocket.bufferedamount read-only property returns the number of bytes of data that have been queued using calls to send() but not yet transmitted to the network.
... syntax var bufferedamount = awebsocket.bufferedamount; value an unsigned long.
... specifications specification status comment html living standardthe definition of 'websocket: bufferedamount' in that specification.

WebSocket.close() - Web APIs
the websocket.close() method closes the websocket connection or connection attempt, if any.
... syntax websocket.close(); parameters code optional a numeric value indicating the status code explaining why the connection is being closed.
... specifications specification status comment html living standard the definition of 'websocket.close()' in that specification.

WebSocket: close event - Web APIs
the close event is fired when a connection with a websocket is closed.
...given that you have a variable called examplesocket that refers to an opened websocket, this handler would handle the situation where the socket has been closed.
...et.addeventlistener('close', (event) => { console.log('the connection has been closed successfully.'); )}; you can perform the same actions using the event handler property, like this: examplesocket.onclose = function (event) { console.log('the connection has been closed successfully.'); }; specifications specification status html living standardthe definition of 'websocket close' in that specification.

WebSocket.extensions - Web APIs
the websocket.extensions read-only property returns the extensions selected by the server.
... syntax var extensions = awebsocket.extensions; value a domstring.
... specifications specification status comment html living standardthe definition of 'websocket: extensions' in that specification.

WebSocket: message event - Web APIs
the message event is fired when data is received through a websocket.
... bubbles no cancelable no interface messageevent event handler property onmessage examples // create websocket connection.
... const socket = new websocket('ws://localhost:8080'); // listen for messages socket.addeventlistener('message', function (event) { console.log('message from server ', event.data); }); specifications specification status html living standardthe definition of 'websocket message' in that specification.

WebSocket.onclose - Web APIs
the websocket.onclose property is an eventhandler that is called when the websocket connection's readystate changes to closed.
... syntax awebsocket.onclose = function(event) { console.log("websocket is closed now."); }; value an eventlistener.
... specifications specification status comment html living standardthe definition of 'websocket: onclose' in that specification.

WebSocket.onerror - Web APIs
the websocket interface's onerror event handler property is a function which gets called when an error occurs on the websocket.
... syntax websocket.onerror = eventhandler; value a function or eventhandler which is executed whenever an error event occurs on the websocket connection.
... example websocket.onerror = function(event) { console.error("websocket error observed:", event); }; specifications specification status comment html living standardthe definition of 'websocket: onerror' in that specification.

WebSocket.onmessage - Web APIs
the websocket.onmessage property is an eventhandler that is called when a message is received from the server.
... syntax awebsocket.onmessage = function(event) { console.debug("websocket message received:", event); }; value an eventlistener.
... specifications specification status comment html living standardthe definition of 'websocket: onmessage' in that specification.

WebSocket.onopen - Web APIs
the websocket.onopen property is an eventhandler that is called when the websocket connection's readystate changes to 1; this indicates that the connection is ready to send and receive data.
... syntax awebsocket.onopen = function(event) { console.log("websocket is open now."); }; value an eventlistener.
... specifications specification status comment html living standardthe definition of 'websocket: onopen' in that specification.

WebSocket: open event - Web APIs
the open event is fired when a connection with a websocket is opened.
... bubbles no cancelable no interface event event handler property onopen examples // create websocket connection.
... const socket = new websocket('ws://localhost:8080'); // connection opened socket.addeventlistener('open', (event) => { socket.send('hello server!'); }); specifications specification status html living standardthe definition of 'websocket open' in that specification.

WebSocket.protocol - Web APIs
the websocket.protocol read-only property returns the name of the sub-protocol the server selected; this will be one of the strings specified in the protocols parameter when creating the websocket object, or the empty string if no connection is established.
... syntax var protocol = awebsocket.protocol; value a domstring.
... specifications specification status comment html living standardthe definition of 'websocket: protocol' in that specification.

WebSocket.readyState - Web APIs
the websocket.readystate read-only property returns the current state of the websocket connection.
... syntax var readystate = awebsocket.readystate; value one of the following unsigned short values: value state description 0 connecting socket has been created.
... specifications specification status comment html living standardthe definition of 'websocket: readystate' in that specification.

WebSocket.send() - Web APIs
the websocket.send() method enqueues the specified data to be transmitted to the server over the websocket connection, increasing the value of bufferedamount by the number of bytes needed to contain the data.
... syntax websocket.send("hello server!"); parameters data the data to send to the server.
... specifications specification status comment html living standardthe definition of 'websocket: send' in that specification.

WebSocket.url - Web APIs
the websocket.url read-only property returns the absolute url of the websocket as resolved by the constructor.
... syntax var url = awebsocket.url; value a domstring.
... specifications specification status comment html living standardthe definition of 'websocket: url' in that specification.

Tools for analyzing Web Audio usage - Web APIs
while working on your web audio api code, you may find that you need tools to analyze the graph of nodes you create or to otherwise debug your work.
... chrome a handy web audio inspector can be found in the chrome web store.
... firefox firefox offers a native web audio editor.

Web NFC API - Web APIs
the web nfc api allows exchanging data over nfc via light-weight nfc data exchange format (ndef) messages.
... note: devices and tags have to be formatted and recorded specifically to support ndef record format to be used with web nfc.
... specifications specification status comment web nfc draft ...

XRWebGLLayer.framebufferHeight - Web APIs
the read-only xrwebgllayer property framebufferheight indicates the height of the framebuffer, in pixels.
... syntax let bufferheight = xrwebgllayer.framebufferheight; value the height in pixels of the xr device's framebuffer.
... let gllayer = xrsession.renderstate.baselayer; gl.bindframebuffer(gl.framebuffer, gllayer.framebuffer); framewidth = gllayer.framebufferheight; frameheight = gllayer.framebufferheight; specifications specification status comment webxr device apithe definition of 'xrwebgllayer.framebufferheight' in that specification.

XRWebGLLayer.framebufferWidth - Web APIs
the read-only xrwebgllayer property framebufferwidth specifies the width of the framebuffer, in pixels.
... syntax let bufferwidth = xrwebgllayer.framebufferwidth; value the width in pixels of the xr device's framebuffer.
... let gllayer = xrsession.renderstate.baselayer; gl.bindframebuffer(gl.framebuffer, gllayer.framebuffer); framewidth = gllayer.framebufferwidth; frameheight = gllayer.framebufferheight; specifications specification status comment webxr device apithe definition of 'xrwebgllayer.framebufferwidth' in that specification.

Adobe Flash - MDN Web Docs Glossary: Definitions of Web-related terms
flash is an obsolescent technology developed by adobe for viewing expressive web applications, multimedia content, and streaming media.
... adobe flash can run from supporting web browsers via a browser plug-in.

CSS Object Model (CSSOM) - MDN Web Docs Glossary: Definitions of Web-related terms
both of them are part of the critical rendering path which is a series of steps that must happen to properly render a website.
... the cssom, together with the dom, to build the render tree, which is in turn used by the browser to layout and paint the web page.

Cache - MDN Web Docs Glossary: Definitions of Web-related terms
a cache (web cache or http cache) is a component that stores http responses temporarily so that it can be used for subsequent http requests as long as it meets certain conditions.
... learn more general knowledge web cache on wikipedia ...

CalDAV - MDN Web Docs Glossary: Definitions of Web-related terms
caldav (calendaring extensions to webdav) is a protocol standardized by the ietf and used to remotely access calendar data from a server.
... learn more general knowledge caldav on wikipedia technical reference rfc 4791: calendaring extensions to webdav (caldav) rfc 6638: scheduling extensions to caldav ...

CardDAV - MDN Web Docs Glossary: Definitions of Web-related terms
carddav (vcard extension to webdav) is a protocol standardized by the ietf and used to remote-access or share contact information over a server.
... learn more general knowledge carddav on wikipedia technical reference rfc 6352: vcard extensions to web distributed authoring and versioning (webdav) ...

Card sorting - MDN Web Docs Glossary: Definitions of Web-related terms
card sorting is a simple technique used in information architecture whereby people involved in the design of a website (or other type of product) are invited to write down the content / services / features they feel the product should contain, and then organize those features into categories or groupings.
... this can be used for example to work out what should go on each page of a website.

Compile - MDN Web Docs Glossary: Definitions of Web-related terms
for instance in the browser: firefox' spidermonkey javascript engine has a jit built-in that will compile javascript in a website to machine code while you're viewing it so it runs faster.
... projects like webassembly work on making this even better.

Crawler - MDN Web Docs Glossary: Definitions of Web-related terms
a web crawler is a program, often called a bot or robot, which systematically browses the web to collect data from webpages.
... learn more web crawler on wikipedia ...

DTLS (Datagram Transport Layer Security) - MDN Web Docs Glossary: Definitions of Web-related terms
these features are especially useful for one of the most common areas in which dtls comes into play: webrtc.
... all of the webrtc related protocols are required to encrypt their communications using dtls; this includes sctp, srtp, and stun.

Developer Tools - MDN Web Docs Glossary: Definitions of Web-related terms
current browsers provide integrated developer tools, which allow to inspect a website.
... learn more general knowledge web development tools on wikipedia technical reference firefox developer tools on mdn firebug (former developer tool for firefox) chrome devtools on chrome.com safari web inspector on apple.com edge dev tools on microsoft.com ...

Distributed Denial of Service - MDN Web Docs Glossary: Definitions of Web-related terms
normally many persons, using many bots, attack high-profile web servers like banks or credit-card payment gateways.
... the united states computer emergency readiness team (us-cert) defines symptoms of denial-of-service attacks to include: unusually slow network performance (opening files or accessing websites) unavailability of a particular website inability to access any website dramatic increase in the number of spam emails received—(this type of dos attack is considered an email bomb) disconnection of a wireless or wired internet connection longterm denial of access to the web or any internet services learn more general knowledge denial-of-service attack on wikipedia ...

Domain name - MDN Web Docs Glossary: Definitions of Web-related terms
a domain name is a website's address on the internet.
... domain names are used in urls to identify to which server belong a specific webpage.

ECMA - MDN Web Docs Glossary: Definitions of Web-related terms
on the web it is famous for being the organization which maintain the ecma-262 specification (aka.
... learn more ecma international on wikipedia the ecma international web site ...

Favicon - MDN Web Docs Glossary: Definitions of Web-related terms
a favicon (favorite icon) is a tiny icon included along with a website, which is displayed in places like the browser's address bar, page tabs and bookmarks menu.
... note, however, that most modern browsers replaced the favicon from the address bar by an image indicating whether or not the website is using https.

First interactive - MDN Web Docs Glossary: Definitions of Web-related terms
first interactive, also known as first cpu idle, is a non-standard web performance metric that measures when the user's window is quiet enough to handle user input, or what is termed as minimally interactive.
...these metrics have been proposed by the web incubator community group and are already being used in various tools.

Gecko - MDN Web Docs Glossary: Definitions of Web-related terms
web browsers need software called a layout engine to interpret html, css, javascript, and embedded content (like images) and draw everything to your screen.
... since all firefox os apps are web apps, firefox os uses gecko as its app runtime as well.

Graceful degradation - MDN Web Docs Glossary: Definitions of Web-related terms
graceful degradation is a design philosophy that centers around trying to build a modern web site/application that will work in the newest browsers, but falls back to an experience that while not as good still delivers essential content and functionality in older browsers.
... it is a useful technique that allows web developers to focus on developing the best possible websites, given that those websites are accessed by multiple unknown user-agents.

Hyperlink - MDN Web Docs Glossary: Definitions of Web-related terms
hyperlinks connect webpages or data items to one another.
... in html, <a> elements define hyperlinks from a spot on a webpage (like a text string or image) to another spot on some other webpage (or even on the same page).

ICE - MDN Web Docs Glossary: Definitions of Web-related terms
ice (interactive connectivity establishment) is a framework used by webrtc (among other technologies) for connecting two peers, regardless of network topology (usually for audio and video chat).
... order: direct udp connection (in this case—and only this case—a stun server is used to find the network-facing address of a peer) direct tcp connection, via the http port direct tcp connection, via the https port indirect connection via a relay/turn server (if a direct connection fails, e.g., if one peer is behind a firewall that blocks nat traversal) learn more general knowledge webrtc, the principal web-related protocol which uses ice webrtc protocols technical reference rfc 5245, the ietf specification for ice rtcicecandidate, the interface representing a ice candidate ...