2015年12月23日 (水)

Edgeも出たし、JetStreamも出たので久々にブラウザのベンチマーク

Windows10とEdgeも世に出たし、SunSpider1.0.2Octane2.0が合体した感じのJetStreamが良さげなので久々にブラウザのJavaScriptベンチマーク。
これやっておくと大体の傾向が見えるので面倒だけど記録していくのが重要かと。

遅いんだけど〜と、データベース屋さんが呼ばれ、現場で見た結果、
遅いのは、
データベースでもなく、
アプリケーションサーバーでもなく、
ブラウザ上で動く、JavaScriptなんてこともあるわけで。

IEの一人負けの時代からモダンプラウザのJavaScript速くなったから、
詰め込み過ぎて遅いとか、
ただ単に作りが悪いとか、
ということも多くなってくるんだろ〜な〜と遠くを見てる。


環境
Windows 10 Pro - Core i7-980X - 3.33Ghz
MacPro OS X 10.11.2 - Intel Xeon E5645 * 2 - 2.4Ghz

CPU比較結果から
Core i7-980X 3.33Ghz/Intel Xeon E5645 2.4Ghzを約1.34
Intel E5645 2.4Ghz/Core i7-980X 3.33Ghzを約0.75
としてあります。

http://www.cpubenchmark.net/compare.php?cmp[]=1252&cmp[]=866
Cpu比較

これからはJetStreamだけでいいと思うんですが、Octane2.0とSunSpider1.0.2の結果も載せています。
(V8とかOctane1.0の計測したのですがそれほど傾向に違いは見られないこともあり略)

各試験共通:10回実行して、Max()/Min()を除いた結果をAvgとしています。

JetStream


Windows 10
Win_jetstream
Win_jetstream_detail


OS X

Osx_jetstream
Osx_jetstream_detail


Core i7-980X 3.33Ghzの結果をIntel E5645 2.4Ghz換算(0.75倍)したグラフ
OSの違いなどもありますが、同一ブラウザはほぼ同じ傾向がありますね。
それにしてもEdge頑張ってますね〜。IEはもういいんじゃないかなw

Osx_winconvert_jetstream


Octane 2.0


Windows 10
Win_octane2
Win_octane2_detail


OS X

Osx_octane2
Osx_octane2_detail


Core i7-980X 3.33Ghzの結果をIntel E5645 2.4Ghz換算(0.75倍)したグラフ
OSの違いなどもありますが、同一ブラウザはほぼ同じ傾向なのはJetStreamの結果と同じ傾向。
単一プラットフォームのブラウザの方が有利といえば有利だとは思いますが、Chrome/Opera/FireFoxって頑張ってると思います!!

Osx_winconvert_octane2

SunSpider 1.0.2


Windows 10
Win_sunspider102


OS X


Osx_sunspider102


Core i7-980X 3.33Ghzの結果をIntel E5645 2.4Ghz換算(1.34倍)したグラフ
SunSpiderはIE11の頃から(なぜか?)ダンドツだったわけですがEdgeになってもその傾向はあるようですね。
Octane系では平均点な感じなので合わせるとJetStreamの結果近づくと思われます。

Osx_winconvert_sunspider


そして、最後は個人的な趣味w 
document.write()を10,000回したらどうなるかw シンプルな繰り返しです
Edgeはかなり早くなってきてますが、他のブラウザと比べるとやはり何か違う傾向があるんですよね:)

Windows 10
20151223_163726


OS X

20151223_163806


Core i7-980X 3.33Ghzの結果をIntel E5645 2.4Ghz換算(1.34倍)したグラフ
document.write()*10000回、Edge速くなってますが、他のブラウザには...
私の趣味なのでご勘弁を。これ比較しないと落ち着かなくてw

20151223_163911

ではでは、メリークリスマス



あれから1年.....あの恐怖が再びw
http://discus-hamburg.cocolog-nifty.com/mac_de_oracle/2014/02/w-2053.html

まだ、レガシーブラウザと戦うのですか...
http://discus-hamburg.cocolog-nifty.com/mac_de_oracle/2013/01/post-bc4e.html

ネタとして古すぎるので、思い出話ですけどw
IEって遅いんだよー。ってことをあまり気にしてない方へ。
http://discus-hamburg.cocolog-nifty.com/mac_de_oracle/2010/05/ie-a910.html


| | コメント (0) | トラックバック (0)

2014年6月11日 (水)

html5j パフォーマンス部 @ DeNA へ参加してきた

html5j パフォーマンス部 第二回勉強会へ参加してきた。

勉強会2連チャンでした :)

html5jとか勉強会(そんな名称になる前から参加してました :))には何度か参加していますが、パフォーマンスという単語に脊髄反応して当日のセッション内容を確認もぜず参加してしまったw のは内緒。


データベースが遅い! と呼ばれ、調査すると本当に遅いのはブラウザの上、なんてことも意外に多いんですよね。

10301204_712086918857590_3502558762

講義を受けてるみたいで脳に汗かいた。 

1.品質管理と統計学「IT業界へどうつなぐ?」 - 成蹊大学 / 中西寛子
2.ソフトウェア工学の基礎を学ぶ - 大槻肇


ところで、
今回で2回目のようですが、16回先までテーマが決まっているようでおどろきました。
他の勉強会を運営している方がってどうしてるんだろ?。  

そして、DeNAさんのセミナー会場いいですよね〜〜〜。
都合がつけば次回も参加すると思います。 :)

| | コメント (0) | トラックバック (0)

2014年2月11日 (火)

あれから1年.....あの恐怖が再びw

何故、この時期になるとブラウザと戦うことが多いいんだ〜見たいな思いもあるんだけど.....再びブラウザと格闘してきた(結果:今回は見事に敗北w むーりー)

さすがに、いまさらIE9,8,7なんて話じゃなくてよかったのですが...今回はIE10でございましたw


そういえば、あれから一年たったな〜と見てみたらIE10は載せてなかったのだ〜〜。
まだ、レガシーブラウザと戦うのですか...

今回は、IE11やWebKit陣営へ加わったOpera 19なども加えていつものベンチマーク結果を更新しました。 ;)

IE10に勝てなかったのはChromeファーストで開発しているからに違いねぇ〜 (負け惜しみw

Windows8.1のFF26、Chrome32、Opera19はWindows8と同じPCでほぼ同じスコアだったため載せていません。
また、IE11のデータはWindows7/8.1のみ。(Windows8版IE11がリリースされていないため)

・SunSpider 1.0.2 - https://www.webkit.org/perf/sunspider/sunspider.html

Windows7は OS XのVirtualBoxを利用しているのでオーバーヘッドを考えたとしてもIE11の異常な速さが目につきますね。(まあ速ければ文句はないです、はいw)
そして、Webkit陣営となったOpera 19がChromeなみのスコアを叩き出す!!!!!
Sunspider102


・Google Octane JavaScritpt Benchmark V2 -

SunSpiderでは検討健闘しているIE11もOctane V2ではまだ遅れが目立ちますね。
FireFox26はOS X阪で遅れが目立ちます。ガンガレ。
そして、ここでも、Opera 19が驚きのスコアを叩き出している.....恐るべし :)
Octanev2lite


Safariなど一部のブラウザのデータが漏れていたのでそれらのブラウザのデータを含むグラフを追加
Octanev2


いや、うち、まだ〜昔のブラウザ使ってますよ〜って方もいると思うので、レガシーも含めて旧バージョンのベンチマークサイトの結果も載せておきます。

・SunSpider 0.9.1 -

IE8やIE9(64bit)がダントツで遅かったわけですが、これを見たらヤバいと思いますよね。悪い意味で。
そして、Opera 19すげ〜ぞw やればできる子!
Sunspider092


・Google Octane JavaScript Benchmark V1 -

これを見れば、IE10とIE11ってそーとーちげ〜よって感じなのがわかります orz.
ほんとIE10もターゲットにするならIE10ファーストで開発/テストしろよって感じです。はい。
Octanev1


・Google V8 JacaScript Benchmark suit Ver.7 -

IE8 V8の結果はどこ?ってぐらい低いのでよーく探してくださいね。一番左のがそうです。
V8

そして、最後は恒例のdocument.write() * 10000
んなもんつかうかよ〜って感じですが。見てると面白いので毎回やってますw

いままで遅めだったChromeですが、32では速くなってるじゃありませんか〜〜〜〜〜〜 :)

そして、それ以外では結構いい感じだったIE11ですが、Windows7 (VM)でまさかの結果が...
他のプラットフォームの結果と比較しても異常な値でした。IE10もVM上だと同様の傾向はありますが...
調べていないので原因は不明です...だれか調べてw....単純にそこはチューニングしてないからとか....w...勝ってに想像しているところ...w



Documentwrite10000

注)10回計測しmin/maxの値を除いた8回分の平均値をグラフ化しています。


| | コメント (0) | トラックバック (0)

2012年1月22日 (日)

WIF2012 の季節が近づいて来たな〜 :)

ウェブデザイン国際フェスティバル開催されるよ〜。

今年も熱い戦いがあるんだろーなー :) Interactive Design International Festival  29th-31st May 2012, Limoges, France 

楽しみだ



20120122_03912



WIF 2008 - ウェブデザイン国際フェスティバル
WIF2008 - Webdesign International Festival
WIF2008 - Webdesign International Festival - 予選終了
24(テレビドラマではないよ)
WIF2008 - Webdesign International Festival - ファイナリスト決定!
WIF2008 - Webdesign International Festival - 事務局スタッフの方がコメントをくれた!
WIF2008 - Webdesign International Festival - Finalまであと1ヶ月余り
いよいよWIF2008開幕
WIF2008 - WebJamが開始された。
WIF2008 - WebJam Results
WIF2010 - Web Design International Festival 2010だった〜
WIF2010 ファイナリスト 35チーム決定

| | コメント (0) | トラックバック (0)

2010年12月 7日 (火)

box-shadowを使い始めて…

私のブログでCSS3のbox-shadowを使い始めてるのでお気づきの方も多いと思いますが、まだまだブラウザ間で表示に差異があるんですよね〜(そもそも対応していないIE8以前や、環境がないのでIE9では未確認、いずれWindows7を買ってVM環境上では使う事になると思いますが…)

<div>に以下のようなbox-shadowとborder-radiusプロパティを設定してあります。(関連部分のみ)


-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;

-webkit-box-shadow:2px 2px 40px #000;
-moz-box-shadow:2px 2px 40px #000;
box-shadow: 2px 2px 40px #000;


各ブラウザで表示してみるとSafari5、Chrome8とFirefox3/4、Opera10で違いがでます。
Safari/Chromeは想定通りの陰になりますが、FirefoxやOperaだと陰が広がり過ぎて切れている部分がありますね。ちょっと気になった点なのでメモ書き。

(実際のところSafari/ChromeとFirefox/Operaのどちらの描画がただしいんだろー、Safariで調整しちゃってるからSafari/Chromeでの描画は見た通りなんだけど…)

・Safari5

Safari5

・Chrome8
Chrome8

・Firefox3.6/4.0b
Firefox36
Firefox40b

・Opera10.63
Opera10

| | コメント (0) | トラックバック (0)

2010年10月15日 (金)

goo.glの404 not foundは意外とシンプルだった :)

Google さんの短縮URLサービスの404 not foundページ、意外とシンプルね。もっと凝っているかと想像してたんですが (^^;;;

17



素敵な404 not foundページを探して〜w

| | コメント (0) | トラックバック (0)

2010年10月11日 (月)

bit.lyの404ページってこんなだったのか。

HTML5ベースの素敵な404 Not Foundってのが気になってるので、404に反応してみたり…

bit.lyの404ページはフグだったのか。



14



HTML5ベースの素敵な404 Not Found

| | コメント (0) | トラックバック (0)

2010年10月 5日 (火)

HTML5ベースの素敵な404 Not Found

ごめんなさい、ごめんなさい。アイデアだけなのでまるっとjpgでございます。

HTML5ベースの素敵 404 Not Found Page募集ってのがあって、アイデアだけ浮かんだのでメモ替わりに。

あとでちゃんと考えますというか作ります :) ほんとかw

404notfound_test

| | コメント (0) | トラックバック (0)

2010年9月15日 (水)

HTML5とか勉強会 第10回@Google

昨年暮れに初めて参加したHTML5勉強会以来かなり久々にHTML5勉強会改め、HTML5とか勉強会@Googleに参加してきた。もう10回目なんですね。いつもすぐに定員一杯でキャンセル待ちとかでしたがGoogleさんのオフィスの会場なのでいつもより人数多めだったのですね :) 久々に楽しかったですよ〜懇親会もね。
Photo_4

4_2


以下、今回の発表内容など。

Ustream http://bit.ly/dxUSak

第10回記念デモアプリ(Safari5 only)
http://komasshu.com/html5demo/10thanniversary/

小松さんのスライド資料(Safari5 only)
http://komasshu.com/html5demo/10thanniversary/slides/#p0

白石さんのスライド資料(Safari5 only)
http://openweb-labs.appspot.com/slides/jqtouch/presentation.html

吉川さんのスライド資料
http://prezi.com/ftfqmwlszidy/jquery-mobile/

たにぐちさんのブログ(スライド資料は後にブログで公開されるそうです)
http://h2o-space.com/blog

直鳥さんのスライド資料
http://www.slideshare.net/naotori/100915-html5

TwiMap(iPhoneでご利用ください、とのこと。場所のURLを共有するサービス)
http://twimap.net/

10回を記念してビデオメッセージをくれたイアン・ヒクソンさん(HTML5仕様編集者)に、みんなでお礼を言ったビデオ

| | コメント (0) | トラックバック (0)

2010年4月 6日 (火)

ブラウザ で Quake 2

Googleさんいろいろやってくれます。あの3Dゲームをブラウザで! ですと! :)
HTML 5の機能を使いまくっているいるようで、いまのところSafariとChromeで動作するとのこと。


すごい。Quake 2のjavaのコードも見れるのね :).  
http://code.google.com/p/quake2-gwt-port/

-以下抜粋-

In the port, we use WebGL, the Canvas API, HTML 5 <audio> elements, the local storage API, and WebSockets to demonstrate the possibilities of pure web applications in modern browsers such as Safari and Chrome.


quake 2 gwt pot

| | コメント (0) | トラックバック (0)

2010年3月24日 (水)

WIF2010 ファイナリスト 35チーム決定

WIF2010ファイナリスト決定、日本からは3チーム。がんばってね。(^^)
Picture_1

| | コメント (0) | トラックバック (0)

2010年3月 7日 (日)

WIF2010 - Web Design International Festival 2010だった〜

ここのところ忙しくて、毎日見れていたブログなども見る間もなく帰宅すると寝る〜見たいな日々が続いていた影響もあり、気づいたら予選終わってたんですね、Web Design International Festival 2010

そういえばWIFの存在を知ったのって息子ちゃんが生まれた年だった。時の経つのは早いものだ〜。

話がそれてしまいましたが、日本から参加した15チームのうち10チーム以上はFlashを利用してますね。今後はHTML5を利用したの作品も登場してほしいと思う今日この頃。:)

日本語のサイトはこちら http://japan.partners.webdesign-festival.com/


2

WIF本家のサイトはこちら、http://www.webdesign-festival.com/2010/

3

| | コメント (0) | トラックバック (0)

2010年2月23日 (火)

すごいよなHTML5で書かれているSketchpad

このSketchpadHTML5で書かれているとか、すごいよね。IEで開くと不幸になるからIE以外のブラウザがいいと思うよ、Safari4とかOpera10とか、FireFox3とか、Chromeとかでね。

ブログはこちらね。http://www.colorjack.com/blog/

Sketchpad

| | コメント (0) | トラックバック (0)

2009年12月 5日 (土)

HTML5 を使ってみよう!@Opera 東京オフィス

HTML5 を使ってみよう!@Opera 東京オフィス
ということで、目黒のOpera東京オフィスへいってきました。2時間ほどでしたが、W3CのMichael SmithさんによるWeb Socketsのお話では最後はホワイトボードまで使って講義みないな雰囲気になったり、日本語ペラペラのOperaのDaniel DavisさんのHTML4をHTML5へ書き換えるデモなど楽しい時間となりました。
まあHTML5を調べ始めたばかりなのでGreeさんのオープンソース勉強会なども合わせると、私にはじめの1歩じゃなくて2歩ぐらいとして丁度よい内容かな…と。

| | コメント (0) | トラックバック (0)

2009年12月 4日 (金)

HTML5のWeb Database仕様は勧告まで行かない可能性があるとか

先月参加した第19回 オープンソーステクノロジー勉強会@Gree (デベロッパのためのHTML5入門)でも紹介されていたWeb Database(Web SQL Databaseへ改名)に関する仕様はどうやら勧告まで行かない可能性が高いと、メーリングリスト(html5-developers-jp )に流れて来た。

Appleさんとか実装しちゃってるけど。。今後はSimpleDatabase(Indexed Databaseと改名)へシフトしていくのか?…


詳細は以下。

ブラウザ上のデータベースに関して:http://javascript.g.hatena.ne.jp/edvakf/20091102/1257139731

| | コメント (0) | トラックバック (0)

2009年11月21日 (土)

第19回 オープンソーステクノロジー勉強会@Gree (デベロッパのためのHTML5入門)

Greeさん主催のオープンソーステクノロジー勉強会今回で19回目。お題は、「デベロッパのためのHTML5入門 」html5-developers-jp管理人の白石俊平さんのお話。

Applicatoin CacheとWeb Workersの話以外は予習の成果で付いて行けた。 :) Web Workers Threadと呼ばれたりしているみたいだけどThreadって呼ばないようがいいように感じた。
共有メモリは持っていない様でDOMにもWorkerからは直接アクセスできない、替わりにUI Threadとメッセージのやり取りをして必要な情報をやり取りするらしい。プロセス間通信的。

昔、バックグランドプロセスとGUIプログラム間のやり取りをApple Eventを使って書いたことがあったのだが、それに近い雰囲気なのかなぁと、おぼろげに理解したつもりになっているところ。面白かった! 

今月、来月もHTML5絡みのイベントとか勉強会に行く予定なのでそれらも楽しみだ。:)


以下はSafari4で試すといいよ...
1


あ、Canvasで思い出した。そろそろDashboard de Aquariumも1.5とかのネタ考えとくか。

| | コメント (0) | トラックバック (0)

2009年11月19日 (木)

HTML5のWeb DatabaseとかWeb StorageのDemoを見ておく

Oracleとは直接関係ないネタですが。HTML5の勉強会とか幾つか参加する予定なので軽い予習も予ていくつかのデモとかソースを見ておく。。

デモはSafari4で見たほうがいいよ。
Html5_web_database_004

Safariでの実装もかなり進んでいるようだし、データベース関連のネタもあるのでWeb Database関連のデモとかソースも軽く見ておく(Safari4で見るべし)

Html5_web_database_001

カレンダーにイベントを登録した後、「開発」メニュー→「Webインスペクタ」→「データベース」タブ→「データベース」アイコンを選択。
プロンプトで select文を実行してWeb Databaesの内容を見る事も出来るし「▶」をクリックして展開後、該当する表を選択しても内容を確認できるんだね。:)

Html5_web_database_002

Sticky Notesは2007年に公開されていたデモだけどこちらも参考になる。メモを閉じる時のエフェクトもいい感じ。
Html5_web_database_004

追記11/20: どうやらIE9でHTML5対応とか..いうニュースが流れてるので追記。

| | コメント (1) | トラックバック (0)