The sustainable tiny home trend at CES 2025 revived my dream of building a compoundAmid the chaos of CES we got to retreat to the well-appointed calm of sustainable pods, electric trailers and EV RVs.
内容が難しくなる前にFirebugに慣れる! 第1回から第4回まで、jQueryについての各セレクタやメソッドなどを見てきました。各回で簡単なサンプルも載せていましたが、皆さんここまでの内容については問題なくついてこれていますでしょうか? まだjQueryの基礎について全てを説明し終えてはいないのですが、そろそろスクリプトも長くなってきて、考えることも難しくなってきています。第3回と第4回の内容を振り返ってみても、少しずつスクリプトの量も増えてきているのがわかると思います。この先も、内容が増えていくにつれて、スクリプトも長く、手順をうまく考えなくてはならなくなってきます。 内容がもっと難しくなっていく前に、一度ここで復習をして、この先に備えておきましょう。 Firebugをもっと使ってみる ここまで、いくつかサンプルなどを紹介してきましたが、まだまだjQueryがいまいち理解できていない人
JavaScript デバッガ (JavaScript Debugger) JavaScriptのコードにブレークポイントを設定して、ステップ実行などを行えます。名前が同じで混同しそうですが、JavaScript Debugger (Venkman) ではありません。 SyntaxErrorなどのエラーが含まれるファイルは、デバッグできません。目的のファイルをJavaScript デバッガで見つけられない場合には、ブラウザコンソールでエラーが発生していないか確認します。 基本 起動方法 JavaScript デバッガは、そのデバッグ対象によって起動方法が異なります。それぞれ[Firefoxボタン]のメニューから、 Firefoxで実行しているWebコンテンツ … 【Web開発 → デバッガ】 Firefoxのシステム関連 (アドオンなど) … 【Web開発 → ブラウザツールボックス (ブ
世界のJavaScriptを読もう @ 2014 ^目的: ウェブの世界は絶対変化するもの 変化する前提の行動が求める それをどうやって見ていくか、それを知ってどうするか ^ JavaScriptやブラウザ周りのリリースの状況はウェブの変化にあわせるように変化してきている。 どのように変化してきたか知り、どうやって変化を見ていくのか、そしてわたしたちはどう変化していくのかを考えよう。 アジェンダ 世界のJavaScriptを読もう @ 2012 の続編的なものです ブラウザやJavaScriptのリリースは変化してきている 私たちはどのように変化を知り見ていくのか そして私たちはどのように変化していくのか [fit] 世界のJavaScriptを見る話 [fit] JSer.info 開始 2011年〜 ^ JSer.infoを始めた2011年を一つの基準として考えて、 そこからブラウザや
根本から見直されたUI、同期サービスなどの新機能、iPhoneアプリの紹介はもちろん、Firefoxを別のブラウザへと変えてしまう超強力アドオンについても開発者自身が丁寧に解説。新しいAdd-on SDKを用いた拡張機能開発チュートリアル、真の拡張機能ハッカーだけが知る実践的開発テクニックに加え、HTML5、CSS3、SVG、次世代JavaScriptやデバイスセンサー系APIなど、Webテクノロジも広くカバー。Firefoxのすべてが詰まった本書を手に、ユーザーとして、Web開発者として、拡張機能開発者として、Firefoxを徹底的に使い倒そう。 サンプルPDF ● 1章:Hack #8 Personasで実現する着せ替えブラウザ ● 2章:Hack #14 VimperatorとKeySnailの設計上の違い ● 3章:Hack #18 拡張機能の開発(基礎編) ● 4章:Hack #
本稿ではGreasemonkeyを使ってアプリケーションを作る際の筆者なりのコツを紹介しようと思います。単に筆者が「コツ」だと思っていることを紹介するだけでは面白くありませんので、ちょっとしたアプリケーションを題材にして、作成していく過程をステップに分けて解説していく形式をとることとします。 さて早速Greasemonkeyによるアプリケーションの作成方法を紹介しましょう、といいたいところですが、「Greasemonkeyによるアプリケーションとは何だ?」「そもそもGreasemonkeyとは何だ?」という疑問をお持ちの方もおられると思いますので、第1回は「Greasemonkeyとは何か」ということと、その基本的な使い方を紹介したいと思います。Greasemonkeyをよくご存知な方は、次週までお待ちください。 Greasemonkeyとは GreasemonkeyはFirefox用
はじめに このたび、Firefox 3+Firebugについての連載を書かせていただきます、堀と申します。普段は仕事でJavaScriptやPHPを用いたフロントエンドの開発を行いながら、個人でRoppongi.JSという、JavaScriptのイベントの企画・主催をしております。 この連載では、Firefox 3のリリースに備えて、現在提供されているFirefox 3のベータ版とFirebugによるJavaScriptの開発手法について解説していきます。 第1回はFirefox 3ベータ版とFirebugのインストールから、Firebugによって、どのようなことが行えるようになるかについて簡単に概略を説明していきます。 Firebugとは FirebugとはHTML、CSS、JavaScriptのための開発ツールを提供するFirefoxアドオンです。このツールによって、あなたのJavaS
さて、前回はインストールからFirebugのタブの基本的な部分について紹介をしてきました。今回は、Firebugに実装されているConsole APIの紹介と、Console APIを利用したデバッグ手法について解説していきます。 Firebugで利用できるAPI Firebugには、デバッグに活用できる2つのAPIが実装されています。今回は、その2つあるAPIのうちConsole APIについて解説していきます。 Console API Console APIはFirebugのタブだけでなく、コンテンツ側のJavaScriptから呼び出すことのできるAPIです。デバッグのために便利な関数があらかじめたくさん用意されています。これらの関数を以下に列挙しますので、目を通してください。 console.log(object[, object, ...]) 渡された全てのオブジェクトをconso
Mozillaのゲームに対する本気度を担当者が語る。WebGLが拓くゲームプラットフォームとしてのWebブラウザの姿 ライター:米田 聡 2014年9月2日から4日までパシフィコ横浜で開催されていた日本最大のゲーム開発者会議「CEDEC 2014」では,米Mozilla Foundation(以下,Mozilla)からブラウザのゲームプラットフォーム化を推進している担当者が来日して「Games on the modern Web」(モダンWebにおけるゲーム事情)と題するセッションを行った。4GamerではGame Developers Conference 2013(以下,GDC2013)の際にMozillaの試みをレポートしているが,今回のCEDEC 2014のセッションはその後の進捗報告という感じの内容で,ブラウザのゲームプラットフォーム化が現実になっていることをMozillaの担当
こんにちは、太田です。前回はクロスブラウザの入口として、各ブラウザの特徴をまとめつつ、実際にクロスブラウザなコードを紹介しました。今回はクロスブラウザ対策における基本である、各ブラウザ環境の構築について解説したいと思います。 前回紹介した通りブラウザにはたくさんの種類・バージョンがあります。それぞれが動作する環境を用意するだけでも、一苦労ではすみません。なるべく少ないマシンで、各バージョンをインストールして、さらにデバッグするための環境作りについて紹介します。なお、Safari以外はWindows環境を想定しています。さらに、特に断りがない限りはWindows XP SP3をベースに解説させていただきます。ご了承ください。 各ブラウザのデバッグ環境は近年目覚しいほどの進化を遂げています。統合デバッグ環境の草分けであるFirebugを筆頭に、Safari/Chrome(WebKit)のWeb
4月に新入社員としてWeb制作会社やSIerに入社した方も、開発業務に携わるようになり、HTML/CSS/JavaScriptを使ったフロントエンド開発を始めた方も多いかと思います。HTML/CSS/JavaScriptはWebブラウザーの上で動かせるので、気楽に開発が始められる半面、「デバッグが難しい」「不具合原因の特定が難しい」「どこにミスがあるのか分からない」というような話をよく聞きます。 そんなときに役に立つのがブラウザーに付属している「開発者ツール」です。「開発者ツール」を上手に使うと、不具合の原因特定を効率的に行えます。以下のように現行の全ての主要なブラウザー(Mozilla Firefox/Google Chrome/Microsoft Internet Explorer/Apple Safari)は「開発者ツール」を持っています。ブラウザー自体が無料ですので、もちろんこれら
userChrome.jsをインストールしよう マウスジェスチャのスクリプト「MouseGestures2」をダウンロード サブスクリプトローダをダウンロードし、Firefoxのプロファイルフォルダ内の「chrome」フォルダにある「userChrome.js」に上書きする。MouseGestures2も同じフォルダに移動させる Firefoxを再起動すると、マウスジェスチャが標準で使えるようになっている。ジェスチャの様子は画面左下に表示されるぞ。デフォルトの設定だと、左で「戻る」、右で「進む」、下で「新しいタブを開く」 「All-in-One Sidebar」の機能も置き換えてみよう。「VerticalToolbar.uc.js」を右クリックで保存する 先ほどと同様に、Firefoxの「chrome」フォルダに「VerticalToolbar.uc.js」を移動させる Firefoxを再
WebGLやasm.jsの技術を駆使し、専用プラグインなしでもブラウザ上でUnityで開発したゲームを動かすことが可能になると、MozillaとUnityが発表しました。 Mozilla and Unity Bring Unity Game Engine to WebGL | The Mozilla Blog https://blog.mozilla.org/blog/2014/03/18/mozilla-and-unity-deliver-award-winning-game-engine-to-the-web/ UnityはWindows・Mac OS X・ウェブブラウザ・Flash プレイヤー・iPhone・iPad・Android・Wii・Wii U・PS3・Xbox 360など幅広いプラットフォームのゲーム開発に対応したツールで、2005年にOS Xに対応したゲーム開発ツールとし
MozillaがJavaScriptの実行速度を劇的に改善する新しい方法として提案したのがasm.jsです。 asm.jsはJavaScriptのサブセットと型アノテーションを定義し、事前最適化コンパイラで徹底的に最適化するとともに実行時チェックやガベージコレクションなどの実行速度の足を引っ張る処理を止めてしまうなどの手法で、JavaScriptを高速で実行できるようにします。詳しくは、記事「asm.js:コンパイラのための低レベルかつ高度に最適化可能なJavaScriptのサブセット」をお読みください。 asm.jsは6月末リリース予定のFirerfox 22で対応される予定です。 そしていまのところasm.js対応を表明しているのはMozillaのFirefoxだけですが、5月15日に米国で開催されたGoogle I/Oでは、Chromeでもasm.jsへの最適化が進められていることが
1つ前の記事「JavaScriptをいかに高速化するか、IE9、Firefoxの取り組み」では、IE9とFirefoxにおけるJavaScriptの高速化について紹介しましたが、そもそもJavaScriptの実行速度はなぜ遅いのでしょう? その理由について、Mozilla Japanテクニカルマーケティング担当の浅井智也氏が、スライド「Trace Monkey」でポイントをまとめています(このスライドはタイトルから分かるとおり、Firefoxの当時の新しいJavaScriptエンジン「Trace Monkey」を紹介するために1年以上前に作成されたスライドですが、1つ前の記事を見ると、ここで示された課題はいまも変わっていないようです)。 全67枚のスライドの20枚目から24枚目の5枚を以下に紹介します。 JavaScriptが遅い原因は、以下の4点にまとめられています。 インタープリタ型言
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く