なんとなくで書かないで！HTML5を書く時に気にしてみたいタグごとのお約束 - Qiita
はじめに この記事は クラウドワークスアドベントカレンダー2019 16日目の記事です。 こんにちは！本日25回目の誕生日を迎えたアクセシビリティ向上隊長 みーたです。 昨日は同じチームの@yamanokuさんによる「みんなに知ってもらいたいデザインシステムのこと」でした。 文中で紹介されていた「悲劇的なデザイン」は私もオススメします:) 私は今回、普段みなさんがHTMLを書く時に、よく使うタグごとでちょっと気をつけてみてもらいたい！と思う点をまとめてみました。 初学者ではありますが、正しくHTMLを理解してもらいたいって気持ちがあるので、マサカリは怖くない程度に投げていただいて、みんなで知識を共有していきたいです。 👻 真冬の怪談 突然ですがちょっと怖い話を... 先日、とある画面を改修しようと思って、今どんな感じにスタイル当たってるんだろうと本番環境を見てみたんですよ。 カードタイプ
WebAssemblyがW3Cの勧告に到達。「WebAssembly Core Specification 」「WebAssembly Web API」「WebAssembly JavaScript Interface 」の3つ
W3Cの WebAssembly Working Groupは、Webブラウザ上でネイティブコードに近い実行速度で高速に実行できるバイナリフォーマット「WebAssembly」の仕様が勧告に到達したことを発表しました。 今回勧告になったのは、WebAssemblyに関連する3つの仕様です。 1つ目はWebAssemblyのバイナリファイルを実行する仮想マシンの仕様を定義した「WebAssembly Core Specification」。これは一般的なマイクロプロセッサの動作を模倣するような作りにすることで、WebAssemblyのバイナリファイルでプロセッサのネイティブコードに近い実行速度を実現するようになっています。 2つ目の「WebAssembly Web API」は、さまざまなプラットフォームでWebAssemblyを利用可能にするため、WebAssemblyバイナリファイルのシリ
HTML5のLocal Storageを使ってはいけない（翻訳）｜TechRacho by BPS株式会社
概要 原著者の許諾を得て翻訳・公開いたします。 英語記事: Randall Degges - Please Stop Using Local Storage 原文公開日: 2018/01/26 著者: Randall Degges 日本語タイトルは内容に即したものにしました。 画像は元記事からの引用です。 初版公開: 2019/10/19 追記更新: 2024/04/05 -- リンク情報を記事末尾に移動しました 本気で申し上げます。local storageを使わないでください。 local storageにセッション情報を保存する開発者がこれほど多い理由について、私にはさっぱり見当がつきません。しかしどんな理由であれ、その手法は地上から消えてなくなってもらう必要がありますが、明らかに手に負えなくなりつつあります。 私は毎日のように、重要なユーザー情報をlocal storageに保存す
JavaScriptの最大8倍高速--ウェブアプリ開発を変える「WebAssembly」 - ZDNet Japan
印刷する メールで送る テキスト HTML 電子書籍 PDF ダウンロード テキスト 電子書籍 PDF クリップした記事をMyページから読むことができます ソフトウェアを一度記述すれば、あらゆるスマートフォンやコンピュータで実行できるとしたら、どうなるだろうか。 実現までの道のりがまだ長そうな夢ではあるが、ウェブブラウザを汎用コンピューティングプラットフォームに変えて、極めて要求の厳しいアプリも実行できるようにする取り組みが進行中だ。 「WebAssembly」は、そのビジョンの実現に寄与するバイナリ命令形式であり、ブラウザのソフトウェア実行速度を「JavaScript」使用時の通常速度よりも10％～800％高速化する。 WebAssemblyが可能にするパフォーマンス向上により、非常に負荷の高いデスクトップソフトウェアもいずれウェブブラウザで実行できるようになるかもしれない。WebAss
[JS]スマホも対応、HTML5を使ったゲームを作成できる2DのJavaScript物理エンジン -Planck.js | コリス
クロスプラットフォームの2D物理エンジン「Box2D」をベースに、読みやすくメンテナンス可能なJavaScriptコードとして開発されたJavaScriptのライブラリを紹介します。 Webおよびモバイルプラットフォーム用のライブラリとして、最適化されています。
![[JS]スマホも対応、HTML5を使ったゲームを作成できる2DのJavaScript物理エンジン -Planck.js | コリス](https://cdn-ak-scissors.b.st-hatena.com/image/square/5048cf2d6b1658eccbc6b2d4a3dab3912c66a0c7/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201702%2F2017041001.png)
CDNのエッジでJavaScriptとServiceWorkerを実行できる「Cloudflare Workers」がWebAssemblyに対応
CDNのエッジでJavaScriptとServiceWorkerを実行できる「Cloudflare Workers」がWebAssemblyに対応 CDNプロバイダのCloudflareは、3月にリリースした「Cloudflare Workers」を強化し、WebAssemblyの実行に対応したことを発表しました。 Cloudflare Workersは、同社が提供するグローバルなコンテンツデリバリーネットワーク（CDN）のエッジにおいて、開発者がJavaScriptのコードを配置し実行できる機能を提供します。また、HTML5の新機能として策定されたService Workerも利用可能です。 参考：JavaScriptのコードとService Workerをユーザーに近いCDNのエッジで実行可能。Cloudflareが「Cloudflare Workers」を提供開始 Service W
WebAssembly on Cloudflare Workers
We just announced ten major new products and initiatives over Crypto Week and Birthday Week, but our work is never finished. We're continuously upgrading our existing products with new functionality. Today, we're extending Cloudflare Workers with support for WebAssembly. All Workers customers can now augment their applications with WASM at no additional cost. What is WebAssembly? WebAssembly -- of
SWSRSSR という1フレーム技 - mizchi's blog
Service Worker Side React Server Side Rendering ServiceWorker内でBabelを駆使して、JavaScriptをビルドする - ログミーTech（テック） ってスライドの中で、React の SSR を Service Worker の中でやれば、SEO は死んじゃうけど First Meaningful Paint 最適化できるよねーっていう話をしました。 というわけで実装してみました。すごく単純な React + Redux の Counter です。 ここで試せる https://epic-cray-a9cff8.netlify.com 実装コード https://github.com/mizchi-sandbox/swsrssr DevTools 見る限り、 FMP が 8ms で返ってます。TTI (JSが動くようになる時
[JS]スマホに最適化された優れもの！さまざまなチャートやグラフを実装できるCanvasベースのライブラリ -F2
チャートやグラフは、さまざまなスマホアプリで見かけます。 スマホのデバイスに対してデザイン、インタラクション、パフォーマンスに最適化されたチャートやグラフを実装するHTML5 Canvasベースのライブラリを紹介します。 Node.js、React Nativeなどに互換性もあり、50種類以上のチャートやグラフを簡単に利用できます。 スマホ向けのデザイン デザインはスマホに最適化されており、軽快なインタラクションでデータをより自然に表示します。 スマホに最適化されたパフォーマンス 軽量で、素晴らしいレンダリングのパフォーマンスを実現。 互換性 HTML5のCanvasベースで実装されており、Node.js、React Nativeで実行することもできます。 ライセンス MITライセンスで、個人でも商用でも無料で利用できます。 F2のデモ まずはスマホのアプリでよく見かける、美しいデザインと
![[JS]スマホに最適化された優れもの！さまざまなチャートやグラフを実装できるCanvasベースのライブラリ -F2](https://cdn-ak-scissors.b.st-hatena.com/image/square/38d845daa3306af6511040b4844ec0fb7250d64c/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201803%2F2018083111.png)
Railsの本番WebサイトでServiceWorkerを使ってキャッシュを生成する - Qiita
本番環境にService Workerを導入しましたので、そちらの実装方法についてまとめます。 一部キャッシュ管理にworkbox-swを使ってます。 正直Railsはあんまり関係ないかも。 導入方法については下記記事を書きましたので、そちらを参考にして見てください Sprockets管理のRails4環境でWebサイトをPWAに対応する方法のまとめ（準備〜デプロイ編） 各種イベントハンドリング キャッシュ管理 オフライン対応 計測 エラーハンドリング 上記５つの視点でそれぞれの実装方法を確認します。 javascriptの書き方は今風ではなく、古い書き方になっていますが、ご了承ください........ 今回のやりたいこと全体像 カテゴリAの記事にアクセスした時に、カテゴリAの他の記事をキャッシュしてオフラインでも見れるようにしたい、ということをします。 つまり見たページ以外に、関連する他
普及期を終え成熟期に入った「Node.js」はこれからどうなる？－コミッターが語る現状と未来【前編】
サーバサイドJavaScriptのための環境として登場した「Node.js」は、今やクライアント環境でのJavaScriptランタイムとしてもポピュラーなものとなっています。その開発はどのようなプロセスで進められており、今後はどのような形で進化していくのでしょうか。今回、Node.jsのコミッターであるヤフーの大津繁樹氏と、「Japan Node.js Associations」の代表理事を務める、リクルートテクノロジーズの古川陽介氏に、それぞれの立場から「Node.js」の現状と未来について語っていただきました。モデレーターは、テックフィード代表取締役の白石俊平氏が務めます。本稿は2部構成の【前編】です。 日本の「Node.js」コミッターには実は意外なつながりが？ 白石：今回は、Node.jsのコミッターである大津さんと古川さんに、Node.jsの現在と未来について語っていただきたいと
サイ本こと『JavaScript 第6版』全800ページを読破し、1万行のesaにまとめてわかった5つのこと - #がみぶろ
しがないラジオのgamiです。 JavaScript界隈では有名な、オライリーのサイ本こと『JavaScript 第6版』という鈍器、もとい書籍を読みました。 JavaScript 第6版 作者: David Flanagan,村上列出版社/メーカー: オライリージャパン発売日: 2012/08/10メディア: 大型本購入: 12人 クリック: 252回この商品を含むブログ (18件) を見る 2012年に発行された、約800ページもある、かなり内容の多い本です。 僕は本を読むときにesaに要約しながら読み進めるのですが、サイ本のまとめesaは全体で「約1万行」という修行みたいな分量になっていました。 サイ本、3年越しくらいでやっと読み終わったあああああ！！！esaにまとめながら読んでたけど、コードも含めて約23万字、1万行の分量になっててesaが悲鳴あげてたw今度感想ブログ書く。多くの人
Vim を WebAssembly に移植した - はやくプログラムになりたい
久々のブログです． 6月ぐらいにWebAssembly の仕様をざっくり読んだので，なんか WebAssembly でやりたいなと思って，Vim を WebAssembly に移植してブラウザで動くようにしてみました，という話です． github.com 多分実物を見ていただくのが一番早いので，下記のリンクにアクセスしてみてください． デモページはこちら（下記の注意事項を先にお読みください） 注意 デスクトップ版の Chrome か Firefox か Safari か Edge を使ってください．どうやら macOS では Safari が一番動きが良いです． デモページは全部で1MBほどのリソースを fetch します．モバイルネットワークなどからアクセスする場合はお気をつけください． keydown でキー入力を取っているので，キー入力を横取りするブラウザ拡張などが有効になっていると
create-react-appで作った雛形のコードがService Workerで何をしているのか - Qiita
create-react-appコマンドを実行すると、React.jsプロジェクトの雛形を作れます。 その雛形のsrcディレクトリ以下にregisterServiceWorker.jsというファイルがあります。 また、ビルドするとservice-worker.jsというファイルが生成がされます。 雛形のコードがService Worker上でしている事と、上記ファイルについてまとめてみました。 Service Workerについて Service Workerとは、リッチなオフライン体験・定期的なバックグラウンド同期・プッシュ通知など、いわゆるPWAの機能を実現するために基盤となる技術です。 （詳しくはGoogleのドキュメントにて解説されています。Service Worker の紹介） Service Workerによって実現できる機能は様々ですが、create-react-appで作っ
進化するWeb ～Progressive Web Appsの実装と応用～(de:code2018より)
2018年5月に開催された日本マイクロソフト主催のイベントde:code 2018で「進化するWeb ～Progressive Web Appsの実装と応用～」というセッションを担当しました。 イベントに参加できなかった方に向けてセッションの内容を記事にまとめましたので、ぜひご覧ください。 進化する Web ～ Progressive Web Apps の実装と応用 ～ from Osamu Monoe この記事では、昨今話題に上ることが多いPWAことProgressive Webアプリケーションについて、実際の作り方を解説しながら、それがいったいどういったものであるかを詳(つまび)らかに紹介することを目的としています。 Webでは、「ネイティブアプリと同じことができる」「ネイティブアプリを置き換える」など、期待に胸を膨らませずにいられない浪漫に満ちた噂がありますが、それが本当かどうか記事
マイクロソフトの実験的プロダクト「Blazor」、WebAssemblyで.NETランタイムを実装。WebブラウザでC#など.NETアセンブリをそのまま実行可能に
マイクロソフトの実験的プロダクト「Blazor」、WebAssemblyで.NETランタイムを実装。WebブラウザでC#など.NETアセンブリをそのまま実行可能に マイクロソフトが実験的プロダクトとしてオープンソースで開発している「Blazor」は、WebAssemblyで.NETランタイムを実装することで、Webブラウザの上でC#など.NETテクノロジーによるWebアプリケーションを実現する、Webアプリケーションフレームワークです。 WebAssemblyによってJavaScript以外の言語によるWeb開発が始まる 少し前まで、Webアプリケーションを開発できる言語はJavaScriptだけでした。しかし2010年頃にはJavaScriptの生成をターゲットとするCoffeeScriptが、2012年頃にはTypeScriptが登場し、いわゆるAltScriptによって少しだけ言語の
react-native-dom の何がすごいのか - Qiita
react-native-dom とは experimental と書いてあるが普通に動く。デモを見ると React Native で提供されている仮想 DOM は大体動くといった感じ。 2018 年の React Europe で発表された資料。 https://rndom-slides.vincentriemer.app/ https://www.youtube.com/watch?v=aOWIJ4Mgb2k これの何がすごいかというとブリッジの仕組みにのっとって構築されているところだ。 Native First と言っている。 ブリッジの仕組み iOS のブリッジの仕組みは次でまとめているので参照のこと。 https://speakerdeck.com/januswel/discussion-about-the-bridge https://qiita.com/janus_wel/i
jsdo.it
Come creare il miglior gioco da casinò Quando si progetta un gioco da casinò, la prima cosa che devi considerare è che tipo di gioco sarà. Ci sono molti diversi tipi di giochi da casinò, dalle slot e video poker ai giochi da tavolo e giochi di carte. Dovrai decidere quale tipo di gioco si adatta meglio alle tue esigenze. Ogni tipo di gioco ha il proprio set di regole e regolamenti, quindi dovrai a
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML5.JP - 次世代HTML標準 HTML5情報サイト
Sketchpad