タグ

ブックマーク / qiita.com/mizchi (9)

  • webpack 5 の webpack federation という概念について - Qiita

    注意: まだHEADにすらマージされていない機能です。 僕の現状の理解で書いてます。細かいニュアンスは見落としてるかも。 今の課題 異なるチームで、異なるビルドプロセスのものを統合するような巨大なフロントエンド、いわゆるマイクロなフロントエンドやってると、同じようなライブラリが内部的に重複するよね webpack build (chunk) 間で、そういう自明なもののを重複を省いたり、一方向ではなく、相互に読み出せるようにしたいよね ScriptedAlchemy氏の提案 異なるWebpackビルド同士が連携する、Federation という概念を作る。 Host と Remote という概念を追加する。既存のものは Host となる(?)。 Remote は、それぞれに要求する chunk (react, vue など)と、他に外側に提供するインターフェースを明示する。 (optimaz

    webpack 5 の webpack federation という概念について - Qiita
    kadoppe
    kadoppe 2020/03/21
  • lodash やめ方 - Qiita

    みなさん、 lodash で消耗してますか? 私は消耗しています。 なぜ lodash で消耗するかというと、とにかく思考停止でインストールされ、 node_modules 下で大量に重複します。サイズが大きいlodashが複数バンドルされてビルドされると、重篤なパフォーマンス上の問題を引き起こします。 lodash には実装上の問題もあり、異様に丁寧に、そして富豪的に作られており、その結果ビルドサイズが無駄に大きいです。丁寧に作られて入るのですが、現代のフロントエンド水準や一般的なポリフィルと噛み合っていません。というわけで、常々やめたいと思っています。 ちゃんとES201xを追ってる人からすると、ほとんどの lodash のメソッドは不要に見えるはずです。エントリは、思考停止で lodash で実装しようとする人に、ちょっと考え直しては? と投げつける用の記事になります。 現代におい

    lodash やめ方 - Qiita
    kadoppe
    kadoppe 2019/12/23
  • Qiita beta版のフロントエンドパフォーマンス改善案 - Qiita

    ふとログインすると beta 版UIってのが使えた。完全に dev.to 意識してて笑った。 実際には自分が残してきたロードマップや、Component が使われているのであろうのがわかって、そうそうこれがやりたかったんだよって感じで、とはいえまだ改善点がたくさんって、今の中の人達もわかってると思うけど、元中の人として dev.to ぐらいやるにはどうすればいいってのを残しておきます。 わかる変更点 CSSの脱bootstrap色が強くなった トップ画面が、ユーザーごとのカスタムフィードから beta版 の人気の投稿が主になった 元々そういう目的で企画を起こした記憶がある… フレンドフィードもうあんまり使われてないよね クエリが重いフレンドフィードより、静的にキャッシュできるランキングがトップにあるのはチューニングしやすい 改善案 やや無理難題だったり、中の都合も察してるけど、できるだけ目

    Qiita beta版のフロントエンドパフォーマンス改善案 - Qiita
    kadoppe
    kadoppe 2017/11/25
  • 型なき世界のためのflowtype入門 - Qiita

    http://qiita.com/mizchi/items/3bbb3f466a3b5011b509 で紹介したモダンJSスタックの上に、flowtype を導入して型をボトムアップに追加していくアプローチを紹介します。 なぜflowtypeか、そのゴールは 流行っているライブラリのみを組み合わせて使う場合や、バックエンドとの連携において型が十分に提供される環境なら、正直、flowtypeよりtypescriptでいいと思っています。flowtypeが力を発揮する環境は、既存のJSが大量に存在する環境や、railsなどの動的な型のフレームワーク環境で、静的な定義が抽出できない環境だと思います。 よほど品質が低いライブラリを使わないかぎり、バグはほとんど自分が記述したコードによって発生します。なので、まずは「自分が書いたコードのIFを明確にし、その静的なチェックを行なう」、というのを最初の目

    型なき世界のためのflowtype入門 - Qiita
  • Facebookみたいに改行に合わせて伸びるフォーム - Qiita

    var el = document.querySelector("textarea.your-text-area") el.addEventListener("input", function(ev) { if (parseInt(el.rows, 10) < 8) { const currentRow = el.value.split("\n").length; el.rows = currentRow + 1; } }); 3行目で8行以上多くならないようにしてある。Githubのフォームがこんな仕様だったので真似した。無限に伸ばしたかったら外せば良い。 jQueryは必要ないです。 追記 よく考えたら折り返し考慮してなかったので、もっかい考える。 追記 こうなった function fitToContent(el, maxHeight) { let adjustedHeight =

    Facebookみたいに改行に合わせて伸びるフォーム - Qiita
    kadoppe
    kadoppe 2016/04/17
  • リアルタイムウェブな観点からElixir / Phoenix について - Qiita

    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? ここ最近、 [翻訳] Elixir - 次に来る大物Web言語 - Qiita とか 超高速なJSON APIをElixirフレームワークのPhoenixでビルドしてテストしよう | POSTD を読んで気になっていたので、勉強していた。 前提: 自分はシングルページアプリケーションに特化したフロントエンドエンジニアであり、サーバサイドのプロダクション運用にはそこまで強くない。あとこれはここ2日の勉強した日記でもあり誤解や勘違いも多々あると思う。 リアルタイムウェブアプリケーションのためのサーバー Railsの次の時代、リアルタイムウェ

    リアルタイムウェブな観点からElixir / Phoenix について - Qiita
  • AltJSの選び方フローチャート - Qiita

    JavaScriptわかる - YES 型がほしい - YES Flash/ActionScript3が青春だった - YES Haxe - NO DeNAに勤めている - YES JSX - NO TypeScript - NO Ruby or Python が好き - YES coffee-script - NO クラスはほしい - YES EcmaScript6(Traceur Compiler) or CoffeeScript - NO JavaScriptの文法に不満がある - YES https://github.com/jashkenas/coffeescript/wiki/List-of-languages-that-compile-to-JS - NO JavaScript書けよ - NO 関数型わかる - YES 自分の好きな言語に深く精通している - YES 好きな言

    AltJSの選び方フローチャート - Qiita
  • Backboneでデータバインディングを使ってMVVMをするフロントエンドアーキテクチャ - Qiita

    前提 会社(Quipper)で今からこういう風にしたい、と宣言した社内ドキュメントを公開する。 枯れてるわけではない。 coffeescript Backbone Backbone.stickit (データバインディング) Chapling.js(は、オマケなのでどうでもいいがサンプルコードはこう) backbone.stickitは安心と信頼のNYT製。(実質Backbone作ってるDocumentCloudと一緒のところ?) backbone.stickit 目的 データバインディングを全面的に使って再描画を最小限にし、コードの見通しをよくしたい。 モデルの役割を明示的にし、MVVMを導入する。 理想的なAPI 擬似コード # ビューモデルの定義 class TopicViewModel extends Model defaults: title: '' # たぶんここでパラメータ名(

    Backboneでデータバインディングを使ってMVVMをするフロントエンドアーキテクチャ - Qiita
  • Rails/konachaでJavaScriptのテスト環境とCI環境を作ってTravisに載せた - Qiita

    fastladderのリポジトリにJavaScriptのテスト環境を足してみた。その作業ログ。 具体的には以下の二つのコミット参照 https://github.com/fastladder/fastladder/pull/66/files https://github.com/fastladder/fastladder/pull/85/files 後この記事 http://qiita.com/items/861f913b0f57203420d6 利点 mocha/chaiによるモダンなJSテスト環境 テスト側でも依存解決にsprockets利用可 導入が簡単 欠点 ヘッドレス環境でCI統合がちょっとめんどい javascript処理系が必要なのでJSエンジンが必要(PureなCentOSとかだとtherubyracerが必要) 導入 Gemfileに以下のものを追加する group :t

    Rails/konachaでJavaScriptのテスト環境とCI環境を作ってTravisに載せた - Qiita
  • 1