最近は Cloudflare Workers が熱くて、週末はずっとその調査しています。この記事はそのまとめです。 注意点として、手元でいろいろなパターンで動かして試してはいますが、プロダクション環境で運用したわけではないです。それを踏まえた上でお読みください。 特に断りが無い限り、引用文は DeepL で翻訳したものです。 Cloudflare Workers とはなにか Cloudflare Workers | サーバーレスコンピューティング | Cloudflare 一言でいうなら 「ServiceWorker の API が CDN Edge 上で動く JavaScript 処理系」 です。 Technology Radar では、まだ ASSESS(調査) フェーズという扱いです。 Cloudflare Workers | Technology Radar | ThoughtWo
HTMLファイ部のほんだです。 気づきTips！ Σ(・ロ・) カヤックの中でもHTML5のWebフロントエンド実装を担当する エンジニアを集めた部署「HTMLファイ部」では、 制作にあたってはまったことや、気づいたことをメモ的に蓄積・共有しています。 通常は、 1. 制作で何かわからないことがでた ▼ 2. Google等で検索して解決の糸口をさがす ▼ 3. こんな方法があったのか〜 と気づきを得る というフローでスキルアップしていくことがもっぱらだと思うのですが、 学びを増やしていくためには違うアプローチも必要なんじゃないかと思います。 カヤックHTMLファイ部では、 1. みんなで蓄積したTipsをざぁっと読む ▼ 2. こんな方法があったのか〜 と気づきを得る ▼ 3. 制作の際に導入していく というフローを繰り返し実践していくことで、 検索では気づけないことを学び、実装力アップ
今回、ちょっとした縁によりBonanzaをブラウザで動かしてみました。Bonanza 6.0のソースコードをほぼそのまま利用して、EmscriptenでJavaScriptに変換しています。 技術的なことに興味はない、すぐに遊んでみたい！という方はこちらからどうぞ。初回に45Mほどダウンロードが発生します！ご注意ください。 http://tkihira.github.io/embona/index.html 上のURLに行くとCPU vs CPUの戦いが始まります。自分で戦いたい方は新規対局で設定してください UI周りは相当手を抜いて実装したために多数バグがあるかと思います。ご容赦ください ブラウザが固まったりしませんが、CPU思考中に手を入力したり新規対局するのには大変反応が重い（というか思考が終わるまで反応しない）のにご注意ください データダウンロードで43Mbyte、さらに内部で展開
こんにちは丸山@h13i32maruです。 ES6のGeneratorを勉強する題材としてasync/awaitを実装してみたので、そのメモです。 Genratorとは ES6のGeneratorとは「任意の時点で処理を中断/再開することができる関数」というもの。一般的にはコルーチン(coroutine)と呼ばれるもので、サブルーチン(通常の関数)を一般化したもの。ES6でGeneratorを理解するには3つのキーワードがある。 Generator Function 処理の中断/再開が行われる特殊な関数 function* generatorFunction(){}のようにfunction*を使って定義する Generator Object 中断された処理を再開したり、値を取得し対するオブジェクト var generatorObject = generatorFunction()のように取
2014-12-25 React.jsを触った感想 Javascript React.js Virtual DOM クライアントサイドJS ここ二週間ほどReact.jsを触っていて、業務でも今の案件で使うことにしたので、簡単な紹介と、触ってみた感想。 React.jsについて A JavaScript library for building user interfaces | React React.jsは、Facebook製のクライアントサイドJSフレームワーク。 Angular.jsなどの並べられがちだけど、ああいう俗にいう「MV*」でフルスタックなものとは違って、View層に特化している。 3つの特徴 UIに特化 ここでいうUIとは、UI部品のことで、つまりは複数のDOMを内包する1つの部分的なDOMツリーのこと。これをReactではComponentと呼んでいる。 このComp
Reactの登場以来気になっていた、Virtual DOMアプローチの具体的な差分抽出手法について、virtual-domを読んで確認してみた。 Reactをいきなり読むのは面倒くさかった・ミニマムな実装から読みたかったというのが、こっちを選択した理由。Reactのアルゴリズムが参考にされているものの、Reactには存在する特定の最適化が入ってないかもしれないので、あくまでもReact系のVirtual DOMを実装するには最低限何が必要かを知る程度のものと判断してほしい。 virtual-domについて ReactのVirtual DOM部分だけを切り出して再利用可能な形で再実装したライブラリ。elm-htmlとかMercuryといった箇所でvDOMインフラとして既に使われているので、まったくの趣味プロダクトという訳でもなくなっている。 README.md中での触れられている通り、Vir
Code Faster.Tired of having to run your code to find bugs? Flow identifies problems as you code. Stop wasting your time guessing and checking. Code Smarter.It's hard to build smart tools for dynamic languages like JavaScript. Flow understands your code and makes its knowledge available, enabling other smart tools to be built on top of Flow. Code Confidently.Making major changes to large codebases
Firefox OS Apps are being used around the world—Spain, Poland, Colombia and Venezuela with many more countries coming—so it’s important to consider localizing your app from the beginning. But with the open web being as open as it is, there are many frameworks and technologies to pick from when it comes to localization. For example, the Jed Gettext-style library is a popular traditional option. The
Node学園祭・初参加 初参加だったんですが、ビギナー＆フロントエンド向けのNode.jsツール系セッションを担当させていただきました。なんかめっちゃ緊張した･･･。 参考リンク集 1. Package manager npm Bower npm とフロントエンドのパッケージ管理の未来 ::ハブろぐ The npm Blog — npm and front-end packaging Npm Tips · fiveisprime npmのあまり知られてない機能 10選 - from scratch npm-shrinkwrap Bower Resolutions - Jake Trent 2. Task runner Grunt: The JavaScript Task Runner gulp.js - the streaming build system Node.js の Stream
Browserify を触ってみたメモ。 Browserify とは CommonJS のモジュールの仕組み、つまり Node.js の require をブラウザ上でも使えるようにするもの、ということでいいみたい。Readme を読む限りは、npm にあるモジュールをブラウザ上にもっていくために作られ始めたような印象をうけるが、ちまたのエントリーをみていると AMD に代わりに CommonJS でフロントエンドの依存関係の管理をする (RequireJS ではなく、Node.js 感覚で require 関数をフロントエンドで使う) ためのツールとしても使っていいようだ。 やりたいこと 複数の js ファイルの依存関係を記述したい 最終的に、依存関係を考慮した順番で、ひとつの js ファイルに結合したい 作りたいのは第三者のサイトに埋め込んでもらうスクリプト (サードパーティスクリプト
コロナウイルスが流行する前の2020年1月上旬、中国の杭州に行ってきたのでその記録を書いておく。 はじめに 自分はこれが中国へ行くの5回目。それなりに慣れている方だと思うけど、中国人と一緒に行ったほうが圧倒的に楽です。 数年前にキャッシュレスが普及して、その後も規制が変わったりして行くたびに状況が変わっています。なので、ここで書いてあることは半年後には参考にならないかも。 事前にやっておくこと WeChatPayのアカウントを作る、可能なら本人確認とチャージをやっておく Alipayのアカウントを作って、可能なら本人確認とチャージをやっておく 中国で使える香港SIMを買う WeChatPayとAlipayのアカウントは、外国人でも作れるときと作れないときがある。またお金もチャージできるときとできないときがある。 事前にググってできるかどうか試しておくのが重要。 また、中国はいわゆるGrea
このエントリはFrontrend Advent Calendar 2013 23日目の記事です。 2014/03/16追記 WebRTC-DataChannelについてもエントリ書きました。↓からどうぞ。 WebRTC-DataChannel使ってみたよ WebRTCを仕組みの理解から実装まで Advent Calendarを書くということでなんか新しいことやったほうがいいかなーって思ってたので、今回はWebRTCを調べてみました。 調べながらだったので間違っている箇所もあるかもですが、専門家の方のツッコミあれば歓迎です。 先に作ったサンプルデモを触りたい方は以下のアドレスからどうぞ。 WebRTC Video Chat Sample ※接続名は同時にアクセスしている方全員から見えますのでご注意ください！接続依頼が来た際にはダイアログが出るようにしてますが、安易に応答すると知らない人とつな
ずっと興味はあったし、追っていたんですが手は出せていなかったWebRTCについてやっと学ぶことが出来ました。 ハイパフォーマンス ブラウザネットワーキング ―ネットワークアプリケーションのためのパフォーマンス最適化 作者: Ilya Grigorik,和田祐一郎,株式会社プログラミングシステム社出版社/メーカー: オライリージャパン発売日: 2014/05/16メディア: 大型本この商品を含むブログ (2件) を見る ハイパフォーマンスブラウザネットワーキングという本(以下、HPBN)がありまして、会社の中で輪読会していました。みんなで一つの章を担当しながら話すというスタイルでやっていました。 そこで僕が紹介したWebRTCの話です。 基本的にWebRTCの中でやっていることを深く説明した資料になっています。 HPBNの資料だけで分からなかったところはWebRTCミートアップの資料や先人た
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 事前知識: ブラウザ毎の差異 Android 2.x, 3.x 2.x, 3.x では伝統的に TouchEvent がまともに使えません。 経験上、一部端末でdocument.createEvent('TouchEvent')するとNOT_SUPPORTED_ERRを吐くなどの現象が見られ、seleniumのこのコードでも、MouseEventsを利用して無理矢理回避しています。 4.x (Stock Browser & WebView) 4.x では、やっと TouchEvent が利用できるようになります。 が、 イベントの初期化
Emscripten is a complete compiler toolchain to WebAssembly, using LLVM, with a special focus on speed, size, and the Web platform.
先週アップルが発表した iOs 8 のリリースに、私たちは非常に興奮しております。iOS 8 の正式リリースを手にして数日しか経っていませんが、いち早く世界中の Web 開発者コミュニティに最新のアップルのリリースについて徹底的にお伝えしたいと思っています。もちろん数週間、数ヶ月後にはここではカバーできなかった項目が発覚するのは承知ですが、既に分かっていることを少しでも共有できたらと思っています。 この記事は、今後iOS 8 がアップルのデバイスのベースラインとなることを見越して、HTML5 の現状を技術解析したものです。去年 iOS 7 にも似たようなレビュー記事を Web 開発者のために書きましたので、気になるかたはそちらもご覧ください。 iOS 8 の新機能は HTML5 開発を進めます 今回のアップグレードで加えられた機能について見ていきましょう。 Source: caniuse.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
![GitHub - DrkSephy/es6-cheatsheet: ES2015 [ES6] cheatsheet containing tips, tricks, best practices and code snippets](https://cdn-ak-scissors.b.st-hatena.com/image/square/bff58bae1d7750839dd08d4f20ab68462eb8d0f7/height=288;version=1;width=512/https%3A%2F%2F2.zoppoz.workers.dev%3A443%2Fhttps%2Fopengraph.githubassets.com%2F95fefd3ce71e04caeae7a28cf21f53bb823629d13100f50f42f026cd600645df%2FDrkSephy%2Fes6-cheatsheet)
