捗るかもしれないフロントエンド開発環境LiveReload connect + proxy + easymock testem mocha + expect + sinon assemble、foreman.... などを試してみた話です
`that = this` について思ったこと
thatに思いを馳せる JavaScriptにおいて that = this とか self = this なパターンを頻繁に使うと、作業者の理性が保証されない場合に下記に示す2点の問題が起こりう得ると思っている。 「あー、どうなのかなー、うーん」と思いながら書いてみる。 1.メソッド分割が適切におこなわれない雰囲気 ちょっと極端かも知れないが、Backboneっぽいコードを例にしてみる。 initialize: function() { var that = this; this.listenTo(this.entity, 'success', function() { var bar = that.foo(); that.$el.find('.qux').text(bar); // long. // long.. // logic... }); this.entity.execute(
JavaScriptのTyped Arrayのコピー - kazuhoのメモ置き場
JavaScriptのTyped Arrayにおいて、JavaのSystem.arraycopy相当の関数は以下のような形で実装することができる。 function arraycopy(src, srcPos, dest, destPos, length) { dest.set(src.subarray(srcPos, length), destPos); }
JavaScriptフロントエンド開発の昨今
フロントエンドのパラダイムを参考にバックエンド開発を再考する / TypeScript による GraphQL バックエンド開発
Leaflet — an open-source JavaScript library for interactive maps
an open-source JavaScript library for mobile-friendly interactive maps Leaflet is the leading open-source JavaScript library for mobile-friendly interactive maps. Weighing just about 42 KB of JS, it has all the mapping features most developers ever need. Leaflet is designed with simplicity, performance and usability in mind. It works efficiently across all major desktop and mobile platforms, can b
世の中のHTML5アプリケーションが糞だから、俺が「初期化」の作り方を教えてやんよ - mizchi's blog
2chまとめみたいなタイトルにしてみた。(してみたかった) HTML5のアーキテクチャと初期化とキャッシュの考え方が、「ウェブエンジニア」は本当に出来てない。 とくにソシャゲをウェブビューに貼ってスマホ対応しました系。本当にダメ。 じゃあどうするか？基本的に「初期化」の考え方を直せばどうにかなる。 (この記事はBackboneを使うときに考えてることだけど、他でも一緒だと思う) 前提 シングルページアプリケーション セマンティクスやSEOは考慮しない 基本哲学 共通モデルの初期化を徹底的に行う サーバーにリクエストを投げるのは最小限 クライアントでサーバーモデルのキャッシュを作り、更新が期待されるまで再取得しない 理由 いくらDOMの最適化したところでUXに影響が大きいのはサーバーリクエスト(200~2000ms)で、プログラミング段階で辛さがあつまるのは非同期処理の部分。 プログラマとし
本当にあったフロントエンドセキュリティ怖い話
「location.hrefが信用出来ない問題」 http://hoge.com%2F@example.com/へアクセスした場合にlocation.hrefがhttp://hoge.com/@example.com/を返す （勝手にデコードされている） location.href = location.hrefで別のページに飛ぶ iOS 6.0未満、Android4.1未満の標準ブラウザで再現 Masato Kinugawa Security Blog: location.hrefの盲点 「location.hrefが信用出来ない問題」 location.hrefに@使ってなにか入れるのは普通にできる （http://hoge:huga@example.com/のlocation.hrefはhttp://hoge:huga@example.com/） location.hrefを独自解析
社内研修「JavaScript基礎」の資料を公開します！ - mixi engineer blog
どうも、新卒2年目エンジニアでJavaScript委員会の重田です。 帰省がてら鳥取砂丘や小豆島に行ったらだいぶ日に焼けてしまいました。 さて、もう４ヶ月ほど前になってしまったのですが、新卒研修でJavaScript基礎の講師を担当したので、そのときの資料を公開します。加えて、JSを学ぶ上で押さえておくとよいポイントを解説します。 研修資料 https://github.com/mixi-inc/JavaScriptTraining JavaScript初心者向けの資料になります。 JavaScriptに触れるのがはじめての人でも、配属後すぐに活躍できるようになることを目指して研修を実施しました。 デベロッパーツールで素早くトライ＆エラーを繰り返し、JSを学ぶ 去年ぼくはこの研修を受ける立場でした。今年の講師を担当するにあたって、研修の進め方で最も変えたのはデベロッパーツールを積極的に使う
Carl Danley | JavaScript Design Patterns
“One of the most important aspects of writing maintainable code is being able to notice the recurring themes in that code and optimize them. This is an area where knowledge of design patterns can prove invaluable.” – Addy Osmani In modern day JavaScript, it’s easy to pursue the development of large scale JavaScript applications. We are constantly writing more and more complex web apps that thrive
MVCフレームワークの選択基準と主要フレームワークの特徴
Toru Hosokawa twitter:@anton0825 facebook:toru.hosokawa1 github:hosokawa0825 blog:http://d.hatena.ne.jp/anton0825/ 2012.10.1 ATNDページ JavaScriptのMVCフレームワークが増えている Backbone.js, Angular.js, Spine, etc… FWを選ぶのが大変！ FWの調査手順−１ 作るアプリの要件を洗い出す 規模 複雑度 特殊な要件（特殊なUI、リアルタイム通信など） 各FWの特徴を一覧にまとめる FWの特徴一覧を後でお見せします 情報元：Journey Through The JavaScript MVC Jungle FWの調査手順−２ FW間の比較、アプリの要件とFWの機能の比較（Fit Gap分析）を行い、候補を数個まで絞る 以
PostMessageを使ったクロスドメイン通信 | KnockKnock
JavaScriptはXMLHttpRequestにてセキュリティの関係上、ファイルが置かれているドメインのサーバとしか通信できないという制約（クロスドメイン制約）があります。これを回避するためには、XMLHttpRequest2にてAJAX通信を行う方法があります。XMLHttpRequest2ではサーバー側がAccess-Control-Allow-Originヘッダーを設定していればクロスドメインの制限を回避することが可能です。ただ、これは対応ブラウザでいうと、特にIEで10以降でないと対応していない点で、環境が非常に限定されてしまいます。 XMLHttpRequestにてAJAX通信において、このクロスドメイン制約を突破する一般的な方法がいくつかあります。 PHPやCGIを経由 「JavaScript→PHPorCGI→参照したいファイル」という順に読み込んでいきます。設定が簡単で
Generator のプロトタイプ - hogehoge @teramako
904701 - Implement prototype madness for ES6 generators Firefox 26 (Nightly) で function * () { yield ... } な ECMAScript 6th にある Generator の構文が導入された。 ということで、やる気を出して、チョコチョコと調査。 まず、用語の定義 GeneratorFunctionインスタンス function *() { yield "OK"; } の様な関数オブジェクト GeneratorObject GeneratorFunctionから生成されたインスタンスオブジェクト [[prototype]] オブジェクトのプロトタイプチェーンとなる内部プロパティ // GeneratorFunction function * geneFunc () { yield "OK"
HTML5時代のWeb開発者が知らないとガチヤバな3つの未来予測と6つの脆弱性対策
8月21～23日にパシフィコ横浜で開催された「CEDEC 2013」では、Webの世界に関するセッションも数多く行われた。本記事ではその中から、サイボウズ・ラボの竹迫良範氏による「HTML5のこれまでとこれから、最新技術の未来予測」と、セキュリティコミュニティでは大変著名なネットエージェント、長谷川陽介氏による「HTML5時代におけるセキュリティを意識した開発」の2つのセッションの様子をお送りしよう。 竹迫氏が「HTML」の周りの最新技術と、3つの未来予測を語る 未来予測その1：通信は暗号化が標準に――「スタバでドヤリング」から考える最新技術 竹迫氏はまず、スターバックスでスタイリッシュなMacBook Airをこれ見よがしに使う、「ドヤリング」という技術（？）について写真を出すところから講演を始めた。 実は、この「ドヤリング」、公衆無線LANを利用すると盗聴のリスクがあることが指摘されて
metajs: visualize javascript AST execution
metajs: visualize javascript AST execution About Load Example: Expression Stack Environment ×
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
btappjs.com
http://www.browserswarm.com/
GitHub - hdmchl/gest.js: gest.js is a webcam based gesture recognition library that helps developers make webpages more immersive
JavaScriptでWebDriverのテストコードを書きましょ
Sigma.js
Functional JavaScript/TypeScript
