Denoのフロントエンド開発の動向【2022年春】
半年程前に、以下のような記事を書きました。 Denoでのフロントエンド開発に関して、ここ半年程でまた大きな動きがあったため、改めてまとめていきたいと思います。 Aleph.js v1.0.0のアルファバージョンがリリース Deno製のフレームワークであるAleph.jsのv1.0.0 アルファバージョンが公開されました。 現在、v1.0.0のリリースに向けて積極的に開発が進められています。 Aleph.jsやesm.shなどの作者であるJe Xia氏がDeno社に加わったこともあり、ここ半年で大幅に開発が進んでいる印象です。 また、Aleph.jsは元々はNext.jsに影響を受けたフレームワークという位置づけでしたが、ここ最近ではRemixなどのフレームワークの影響も徐々に受けているような印象を感じています。 ここでは、Aleph.js v1に向けて行われている大きな変更などについて解説
Chromeの操作を記録してPuppeteerやPlaywrightのコードに置き換えてくれる「Headless Recorder」レビュー
ウェブサイトのテスト自動化やスクレイピングに利用されるPuppeteerやPlaywrightといったライブラリを使うと、ChromeやFirefoxなどのGUIを備えるブラウザなしにウェブサイトの情報を取得することができます。そんなPuppeteerやPlaywrightのコードを「ブラウザの操作」から逆に取得できるのが、Chrome拡張機能の「Headless Recorder」です。 Headless Recorder - Chrome ウェブストア https://chrome.google.com/webstore/detail/headless-recorder/djeegiggegleadkkbgopoonhjimgehda Headless RecorderはChromeウェブストアで配信されているので、上記のURLにChromeでアクセスして「Chromeに追加」をクリッ
Deno in 2020 | Deno
With API stabilizations, several large infrastructure refactors, the 1.0 release, and shipping the single most requested feature, 2020 brought a lot of action to the Deno project. Please fill out the Deno survey to help guide our development in 2021. Read on for Deno’s review of the year. January: Goodbye libdeno, hello rusty_v8 libdeno was a C++ library that facilitated an interface between V8 en
Node.js で最近変わりそうな Permission Policy について - from scratch
さてさて、 25日目の Node.js アドベントカレンダーです。もう年の瀬ですね。振り返りシーズンなんで色々書きたかったんですが、ネタを見つけているうちにこの日になってしまいました。 Permission Policy とは Node.js に新しく Permission を提供しようという試みです。元々 Node.js では同じプロセス内で動いてしまえば どんなモジュールであろうと同じ権限で色々できますね。外部ネットワークにアクセスしたり、ファイルを読み書きしたり。 プロセスに元から許可されている権限は全てできてしまいます。これが今まででは普通でしたが、今後はもしかしたら変わるかも？という話です。 権限に関して制限をかけて、拒否させることが可能です。 以下のような要領で拒絶させることができるようになります。 $ node --policy-deny=net 上のオプションでプロセス内の
useEffect完全ガイド
あなたは Hooks を使って複数のコンポーネントを書きました。ちょっとしたアプリも作ったことがあるでしょう。満足もしている。API にも慣れて、その過程でコツも掴んできました。しかも重複したロジックを転用できるよう Custom Hooks を作り、同僚に自慢して見たり。 でも useEffect を使う度、いまいちピンときません。class のライフサイクルとは似ているけど、何かが違う。そしていろんな疑問を抱き始めます。 🤔 componentDidMount を useEffect で再現する方法は？ 🤔 useEffect 内で正確に非同期処理を行う方法とは？ []ってなに？ 🤔 関数をエフェクトの依存関係として記すべき？ 🤔 非同期処理の無限ループがたまに起こるのはなぜ？ 🤔 古い state か props がエフェクト内にたまに入るのはなぜ？ 私も Hooks を使
webpackのbundle後のJavaScriptのサイズを減らしている話 | リクルートテクノロジーズ メンバーズブログ
はじめに リクルートテクノロジーズに4月に新卒入社した 辻 健人です．GitHubではmaxmellonで活動しています． 7月より，やりとりも作成もラクになるシフト管理サービス「Airシフト」 のエンハンス開発を担当しています． 以前は，React製SPAのパフォーマンスチューニング実例という内容で記事を書きました． 今回は同じSPAにおいて，いかにwebpackが生成するJavaScriptのバンドルサイズを減らすかについて紹介していきます． webpackが，そもそも何のためのツールか，バンドルする理由などについては割愛させていただきます． そういった話は，こちらの記事 (Webpack の考え方について – mizchi’s blog) がわかりやすいと思います． Airシフトのアーキテクチャ Airシフトは，React-Reduxで開発されており，かつSSRを行っておりコードの大
GitHub Actions でキャッシュを使った高速化 - 生産性向上ブログ
GitHub Actions Advent Calendar 2019 の 15 日目の記事です。 この記事では、GitHub Actions のキャッシュ機能について解説します。 目次 CI/CD とキャッシュ 簡単な例 (npm) 実験用リポジトリ作成 キャッシュ actions/cache Inputs と Outputs キーのマッチング順序 ビルド失敗時 キャッシュクリア 複数 OS で matrix ビルドするときのキャッシュ 言語ごとの例 アーティファクトとキャッシュの違い 制限事項 注意事項 まとめ CI/CD とキャッシュ CI/CD のビルドでは、リポジトリが依存するパッケージのダウンロードが原因でビルド時間が長くなってしまうことがよくあります。近年の CI/CD ではビルドごとに完全にクリーンな実行環境が用意され、前回のビルドでダウンロードしたファイルが持ち越されない
Small world with high risks: a study of security threats in the npm ecosystem | the morning paper
the morning paper a random walk through Computer Science research, by Adrian Colyer Made delightfully fast by strattic Small world with high risks: a study of security threats in the npm ecosystem Zimmermann et al., USENIX Security Symposium 2019 This is a fascinating study of the npm ecosystem, looking at the graph of maintainers and packages and its evolution over time. It’s packed with some gre
［速報］GitHub Actions発表、Dockerコンテナの連係によるワークフローを自由に定義可能。GitHub Universe 2018 － Publickey
［速報］GitHub Actions発表、Dockerコンテナの連係によるワークフローを自由に定義可能。GitHub Universe 2018 GitHubが主催するイベント「GitHub Universe 2018」が、サンフランシスコで開幕しました。 初日の基調講演で同社は「Pull Request以来もっとも大きな新機能」（同社シニアバイスプレジデント Jason Warner氏）とするGitHubの新機能「GitHub Actions」を発表しました。 GitHub Actionsとは、GitHubのイベントをトリガーとして任意のDockerコンテナの実行を連係させていくことにより、ユーザーが自由にワークフローを定義できるというものです。 ワークフロー内のアクションとしてDockerコンテナを実行できるため、コードのビルドやテストの実行、クラウドへのデプロイなど、GitHubの機
JSer のためのタスクランナー MEMI - Qiita
TL;DR https://github.com/3846masa/memi JSer のためのタスクランナー MEMI ES module で 1タスク 1Function で書ける 依存関係を自動でインストールしてくれる なんで作ったのか きっかけは mimorisuzuko/memi． 要約すると， JavaScript で書けるタスクランナーが欲しい Makefile やシェルスクリプトは，凝った処理を書くのが怠い どのディレクトリでも手間なく使いたい Node.js に関係ないディレクトリで node_modules や package.json を置きたくない タスクで使うモジュールのグローバルインストールは避けたい npm root -g の場所とは別のところに置きたい 既存のタスクランナーと問題点 Makefile シェルスクリプトで書かないといけないので，ちょっと複雑なこ
Node.jsのパフォーマンスチューニングのtips - 技術探し
--inspect, --inspect-brk --trace-opt, --trace-deopt --prof --trace-events-enabled --trace-gc node-report Performance Timing API 優しいコードの書き方へ v8::SnapshotCreator さいごに Node9が10/31に出ました🎉🎉🎉 Node v9.0.0 (Current) | Node.js 今回はNode単体の話なので、Express、Nginx等のチューニングに関してはココには書きません。 また、libuv等のコード内部の話もしません。 --inspect, --inspect-brk もともとあった、--debugから移行されました。(v8.0.0 ~) Chromeを使いデバッグ、プロファイリング等を使えるようになります。 ブラウザで使え
JavaScript モジュールの現状 | POSTD
(注：2017/07/19、いただいたフィードバックを元に翻訳を修正いたしました。) ESM、CJS、UMD、AMD — どれを使うべき？ 最近、 Twitter では、 ESモジュール の現状、特に、 *.mjs をファイル拡張子として導入すると決めた Node.js の現状について大騒ぎになっています。この話題は複雑で、かなりの労力を費やしてそれに専念しないと議論について行けないので、 皆が恐れと不安を抱く のも無理はありません。 古き恐れ フロントエンド開発者なら、 JavaScriptの依存関係の管理に悩まされた日々 を憶えている人も多いでしょう。あの頃は、ライブラリをベンダーフォルダにコピー&ペーストし、グローバル変数に依存し、あらゆる物を正しい順序でconcatしようとしてもネームスペースの問題に対処する必要がありました。 何年もかかって、私たちは共通モジュール形式と中央集権
Server Side Renderingについて知るべきこと。Server Side Renderingとは何か？ それによって何が改善されるのか？（前編） ng-japan 2017
Server Side Renderingについて知るべきこと。Server Side Renderingとは何か？ それによって何が改善されるのか？（前編） ng-japan 2017 JavaScriptフレームワークとして知られるAngularのイベント「ng-japan 2017」がAngular Japan User Group主催で6月17日に都内で開催されました。 Angularは基本的にWebブラウザで実行されるJavaScriptアプリケーションのフレームワークですが、一方でサーバサイドでAngularが備えるHTML構成機能を実現する、いわゆるServer Side Rendering機能の開発も「Angular Universal」として進んでいます。 そのため、Server Side Renderingに興味を持つAngularデベロッパーも増えてきました。 ng-
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHubで「npm」を含む数十のプライベートリポジトリに対する不正アクセスが発生、被害状況や対策方法は？