Dev.Opera — CSS will-changeプロパティについて知っておくべきこと
はじめにWebKit系ブラウザでCSS transformやanimationといったプロパティを使った時に発生する、“例のちらつき”。これに気づいたことのある人ならば、おそらく“ハードウェア・アクセラレーション”という用語をこれまでにも耳にしたことがあるでしょう。 CPU, GPU, ハードウェア・アクセラレーション一言で言うと、ハードウェア・アクセラレーションとは、グラフィックス・プロセッシング・ユニット（GPU）を用いてセントラル・プロセッシング・ユニット（CPU）の処理量を軽減し、ブラウザのレンダリング処理を効率化することです。ハードウェア・アクセラレーターを有効にしてCSS処理を使うと、ページのレンダリングが速くなり、ページ表示が高速化されます。 名前の通り、CPUとGPUはどちらもプロセッシング・ユニットです。CPUはコンピュータのマザーボードに取り付けられている部品で、ほとん
Dev.Opera — Removing showModalDialog from the Web platform
The Blink team is looking to remove support for the showModalDialog() API. Following the initial announcement, there’s been a lot of confusion. This post explains what showModalDialog is, why it’s being removed, and what the consequences are for web developers. What is showModalDialog?The global showModalDialog() method displays a modal dialog box containing a specified HTML document. In this sens
Dev.Opera — Getting to Know Mutation Observers
As you develop more complex JavaScript-heavy applications or roll-your-own framework, you may find that you need to know when the DOM node tree has changed. You may want to know when a view has been loaded or unloaded. Or perhaps you are profiling an application, and want to measure how many nodes are affected by a DOM operation. We used to do this with mutation events. Introduced by the DOM, Leve
Dev.Opera — Better Performance With requestAnimationFrame
IntroductionThis article discusses how you can (and should) improve the performance of your animations, using the requestAnimationFrame API instead of the old setInterval/setTimeout methods, and how requestAnimationFrame is used. And of course, we will show you the mandatory code example of requestAnimationFrame in action. requestAnimationFrame is now supported across all modern browsers, although
Dev.Opera — Better Error Handling With window.onerror
Introductiononerror is a DOM event handler. It is started when an error occurs during object loading. While window.onerror is an event handler, there is no error event being fired: instead, when there is an uncaught exception or compile-time error, the window.onerror event handler is called with contextual information about the error, making for some more powerful error handling opportunities. Unc
Dev.Opera — Animating Flexboxes: The Lowdown
IntroductionOn a recent plane flight, I starting noodling around with combining Flexbox properties, animations and transitions. I came to the conclusion that, for simple accordion-type UI features (see Figure 1), this can be quite useful. Sure, it is tricky to get it working the same across all browsers, but using Modernizr you can feed legacy properties to older browsers that support the 2009 leg
Opera's Developer Relations Team - Opera 10.60 moves to the beta zone
8 March 2022 by Danny Yao in Blog By supporting the Opera Crypto Wallet, Dapp developers can gain access to millions of crypto users on Opera platform. To do so, Dapp developers need simply add a few lines of code to set up integration with the Opera Crypto Wallet. 23 January 2019 by Daniel Bratell in Blog Opera 58 (based on Chromium 71) for Mac, Windows, Linux is out! To find out what’s new for u
Dev.Opera — An Introduction to Datasets
IntroductionHTML5 includes a means to set custom attributes on elements using the data- prefix. Called data attributes, they can be scripted to define and store data as well as increase options for attribute selection when styling with CSS. You can use as many data attributes as you require, providing greater control when manipulating and rendering data. For a first look, here’s an example that ge
Dev.Opera — Flexbox — Fast Track to Layout Nirvana?
IntroductionHTML and CSS is a great content delivery mechanism in many ways — it is easy to learn, flexible and powerful. One thing however that it has never excelled at is complex layouts. If you want to create a simple typographic essay layout with a floated image or two, then fine, but producing complicated multi column layouts has always been fiddly and hackish, and frustrating to get working
効率的な JavaScript - Opera Developer Community
This is a translation of Efficient JavaScript, written by Mark 'Tarquin' Wilton-Jones. 効率的な JavaScript ECMAScript eval や Function のコンストラクタを使うのはやめよう eval や Function のコンストラクタにソースコードの文字列を渡して呼び出すとき, スクリプトエンジンはソースコードを実行ファイルに変換する機能を呼び出してしまう. これは性能の上で高くつく. たとえば, 単なる関数呼び出しの数百倍はかるくかかる. eval 関数は特に性質が悪い. eval に渡される引数は前もってわからない. eval は呼び出された環境で評価されるから, 結果としてその周辺環境は最適化できない. その結果ブラウザは周辺コードを実行時にまるまる解釈しないといけない. こ
Dev.Opera — CSS3 vs jQuery Animations
IntroductionFlash originally paved the way for us to feature more than just text and images on web pages. It allowed developers to include animations and other rich effects on web pages, leading to a much more colourful and varied user experience. However, Flash was plagued by a number of issues like security, long loading times on mediocre networks, etc. Then came JavaScript libraries like jQuery
Dev.Opera — Introduction to XMLHttpRequest Level 2
IntroductionWhat's new in XMLHttpRequestSetting and handling timeoutsRequesting data from another domainAn overview of cross-origin resource sharingThe origin headerAccess-Control-Allow-Origin response headerSending user credentials with requestsSending data as key-value pairs with FormData objectsUsing FormData with an HTML formMonitoring data transfers with progress eventsMonitoring uploadsEnfor
Timing and Synchronization in JavaScript - Opera Developer Community
LoginUser name: Password: Lost password? remember Sign upSign up now to post in the forums, comment on articles, submit your own articles and more. Timing issues are the source of some of the most devious bugs in JavaScript applications. Problems that never show up during development might surface when the application is used by an end-user on a slow computer or with low bandwidth. Such issues may
Dev.Opera — Responsive Images: What’s the Problem, and How Do We Fix It?
Responsive Images: What’s the Problem, and How Do We Fix It? IntroductionResponsive images is a surprisingly complicated topic, and one that's been steadily gaining attention over the last year as more developers discover they need them and then discover there's no good solution yet. This article aims to give an overview of the problem itself, and show the different proposals in the works to addre
Dev.Opera — Understanding the CSS Transforms Matrix
IntroductionWhat is a matrix?Transforms and coordinate systemsCalculating the transform: Matrix and vector mathCompound transforms with the matrixIntroductionThe matrix functions — matrix() and matrix3d() — are two of the more brain-bending things to understand about CSS3 Transforms. In most cases, you’ll use functions such as rotate() and skewY() for ease and clarity’s sake. Behind every transfor
Dev.Opera — Raw WebGL 101 — Part 1: Getting Started
IntroductionWebGL allows you to create real 3D content and render it in a web browser. WebGL is the web implementation of OpenGL ES2 (Embedded Systems 2), and therefore allows us to run real 3D across any system with a browser that supports it and the graphics capabilities to handle such visually rich content. In web technology terms, WebGL is the 3D drawing context of the HTML5 <canvas> element.
Dev.Opera — Efficient JavaScript
Traditionally, a Web page would not contain much scripting, or at least, not much that would affect the performance of that Web page. However, as Web pages become more like applications, the performance of scripts is having a bigger effect. With more and more applications being developed using Web technologies, improving the performance of scripts is becoming increasingly important. With a desktop
Dev.Opera — Introducing ECMAScript 5.1
Table of contents:IntroductionBrowser SupportThe Strict Mode of ES5JSONObject AdditionsArray ExtrasFunction.prototype.bindAdditional ReferencesIntroductionECMAScript 5.1 (or just ES5) is the latest revision of the ECMAScript standard – the specification that JavaScript is based on. Similar in spirit to the HTML5 specification process, ES5 standardizes existing JavaScript implementations in conjunc
Dev.Opera — DOM Event Constructors in Opera 11.60
As mentioned in Divya's post about what's new in Opera 11.60, Opera now supports the DOM Event constructor syntax. It offers a simpler way to create synthetic and custom DOM events. Why might you use a synthetic event or a custom event? Synthetic events can be useful for automated testing, or for developing user interfaces that change conditionally based on user input. Custom events work particula
Opera Developer Community
22 August 2017 by Krystian Zubel in Articles The Opera IT department keeps all of our services online. In their work, they need to manage thousands of servers. Today, one of their tools that is used for SSH Access Control becomes Open Source - check out how it could make your life simpler! 11 November 2016 by Bruce Lawson, Shwetank Dixit in Articles Want to get started with progressive web apps, b
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
