フロントエンドエンジニアがWASM(Rust)でWebアプリを作ってみた
この記事について この記事はアドベントカレンダー2021 Rust 四日目の記事です 概要 フロントエンドエンジニアである筆者がWASM（Rust）でWebアプリを作ってみたので、 その際の技術選定（主にビルド・開発補助周り）について 作ってみた雑感、特に「ぶっちゃけフロントエンドRust[1]ってどうなの？」という点 について書いていこうと思います。 TL,DR 2021年12月現在フロントエンドでのRustの採用は技術的に可能だがエコシステムが未発達なのでそれなりに技術力とコストを要求される とはいえ伸び代はかなりあるのでエコシステムが頑張ってくれれば、数年後には十分一般的な選択肢になってるかも（なってて欲しい） 主な対象読者 フロントエンドに携わる機会がある方々 この記事を読んでいただくことで・・・ フロントエンドという文脈におけるWASMの現状を知ってもらう フロントエンドをRus
Webフロントエンド開発(2021)の見取り図をつくりたい
本業はiOS開発なのですが、6月頃から個人開発でWebフロントを触っています。 Webフロントに入門するときに、開発の前提知識・専門用語が多すぎて、脳が処理しきれない状態になりました。 これでも数年前のより混沌としてた時期よりは安定してきているように思うんですが、それでもやはりカオス感は否めませんでした。 Webフロントエンド開発の見取り図があればいいのにと思ったので、自分でちょっとつくってみようと思いました。 個別の技術要素の情報は豊富にある（ありすぎると言ってもいいかもしれません）んですが、全体像がよくわからないので、 たとえば「TypeScriptで開発した方がいいのか？」とか、「Babelとかwebpackってインストールしなきゃいけないの？」とか、 そういう素朴な疑問が学習進めて行っても、なかなか解消できなかったので、いい感じのざっくり感でまとめられたらと思います。 この記事で全
VueもReactもやったことないのでVanilla JSでやってみたSPA - Qiita
Vanilla JSのメリット フレームワークのサイズが大したことないなら、バニラでやるメリットはあるのか？という話になりますが、実際作ってみてバニラの方が優位だった点が１つありました。 それは動作が速いことです。 今回作ったSPAの中に1つ、画面内の要素が多すぎて描画に数秒時間がかかるページがありました。 どれくらい多いかというと、テキストボックス・チェックボックス・プルダウンなどの入力要素が１画面に１万個以上あります。 この画面を高速化したいと思い、試しにVue.jsで同じようなページを作ってみたのですが、比較するとVanilla JSの方が速かったです。 仮想DOMは速いみたいな記事を目にすることがあり、VueやReactはなんとなく速いイメージを持っていたのですが、よく考えてみるとVueやReactだって最終的には画面描画のためにリアルDOMを操作するわけで、それなら必要最小限のリ
「がんばらないTypeScript」のための現実的な設定を考える ─ 4レベルの厳しさを使い分けてTypeScript疲れを克服しよう！｜ハイクラス転職・求人情報サイト AMBI（アンビ）
ハイクラス求人TOPIT記事一覧「がんばらないTypeScript」のための現実的な設定を考える ─ 4レベルの厳しさを使い分けてTypeScript疲れを克服しよう！ 「がんばらないTypeScript」のための現実的な設定を考える ─ 4レベルの厳しさを使い分けてTypeScript疲れを克服しよう！ エンジニアHubでは2019年に「がんばらないTypeScript」を紹介しました。JavaScriptに静的型付けなどを提供するTypeScriptは、今では実プロジェクトに採用されるプログラミング言語になっています。そこで現実的なTypeScriptの設定を、藤吾郎（gfx）さんに解説してもらいました。 2021年の現在、TypeScriptの価値はますます広く認められるところとなり、多くのJavaScriptプロジェクトがTypeScriptで開発されるようになってきました。またT
microCMSとDeno(Aleph.js)で少し未来のWEBサイト開発
今日は少しだけ未来のWEBサイト開発のお話をします。 ですが、ある程度形になりそうなので、それほど遠くはない未来かもしれません。 Aleph.jsとmicroCMSで簡単なWEBサイトを作成してみました。 開発したサイトは以下のシンプルなサイトになります。 Deno製フレームワークAleph.js 今回はDeno製のSSGフレームワークであるAleph.jsを使用してWEBページを作成してみました。Aleph.jsとはNext.jsにインスパイアを受けたフレームワークであり、ドキュメントの構成もとてもよく似ています(というかNext.jsのドキュメントを引用して作成されています)。 microCMS HeadlessCMSは国産のCMSであるmicroCMSを利用しました。最近ではJavaScriptSDKが開発され、さらに開発がしやすくなりました。 Deno(Aleph.js)の開発は何
Railsを主戦場としている自分が今後学ぶべき技術について(随筆) | うなすけとあれこれ
Rails の問題は Rails のベストプラクティスがフロントエンドのベストプラクティスの邪魔になるどころか全く逆方向で相反してる点です。DHHの思想がフロントエンドと根本的に逆行してる。そういう人が作るフレームワークなのでwebpackerの抽象化を根本的に間違ったりする。 — prev.js (@mizchi) December 1, 2020 昨日もリプライで少し書いたけど、DHH自体が直近のHeyの開発でも明確にJavaScriptというものを触れないようにすることを是としているような主張をしているので、DHH wayが色濃く反映される以上この状態はもう避けられない気がしている — potato4d / Takuma HANATANI (@potato4d) December 1, 2020 Railsがフロントエンドの最先端をゆく人々1から良く思われないのは事実として。 Vie
JavaScript／TypeScriptランタイム「Deno 1.5」がリリース、型チェックを最大15倍効率化
「Deno 1.5」では、前回のリリース以降取り組んできた、TypeScriptコンパイラインフラストラクチャ全体のリファクタリングによって、従来のバンドルインフラストラクチャをswcに基づく新たなバンドラに置き換え、コードタイプチェック時のパフォーマンスを3倍に向上するとともに、--no-checkフラグを使用することで最大15倍向上している。 さらに、バンドラによるコードのツリーシェイクが可能になり、バンドルサイズを大幅に縮小した。また、バンドルが標準のESモジュールとして発行されるようになっている。 その他のおもな機能追加としては、新たなWebプラットフォームAPIとして、ターミナルにメッセージを記録して確認するまで同期的にブロックするalert、ユーザーにメッセージを表示して応答するまで同期的にブロックするconfirm、ユーザーに入力を要求し、テキストを入力して「Enter」を押
クロージャやラムダ式を理解していない組込エンジニアが関数型言語を理解するチャレンジングな4冊(+6冊+α) - ひつじのにっき
手続き型言語を主なフィールドとして頑張ってきた組み込みエンジニアが関数型言語に興味を持ったので相談したら以下の4冊（+6冊）の本を薦められました。順次読んでいきます。多分にチョイスが偏ってます（ので、随時補正を取り込んで下に追記してます。初出は6冊だったのですが現時点で10冊。お好みでどうぞ。一部はWebで公開されていると教えていただいたのでリンクを足しておきました。一夜明けて、さらに参考文献が沢山きたので追記しました）。 ただ全ての本を連続的に読むことでタイトルのように関数型言語がわかった！みたいな意味を成すかはわかりません（しばらくまって結果を見たほうが参考になるはずです）。1冊か章の区切りかでまとめていくので一緒に読んでくれたりお勧めの本を教えてくれたり、誤った理解をなおしてくれると更に喜びます。とりあえず全部買ったので今からスタートです （追記：関数型言語、という入り口から入るなら
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Web版「Excel」の新しいマクロ機能「Office スクリプト」が一般リリース／ユーザー操作をJavaScriptとして記録・編集・再生・共有