進化するPromiseオブジェクト ［JS Modern Features no.2］ | gihyo.jp
こんにちは！ サイボウズフロントエンドエキスパートチームの左治木です。 今回のテーマは「進化するPromiseオブジェクト」です。 Promiseは、非同期処理を管理するためのオブジェクトで、ECMAScript 2015 (ES6)で導入されました。ECMAScript 2017ではasync／await構文が追加され、非同期処理がより直感的に記述できるようになりました。現在では、async／await構文が非同期処理の主流となっています。 一方で、Promiseの機能はasync／await構文の登場後も進化を続けています。これにより、非同期処理がさらに扱いやすくなり、従来のPromiseでは難しかった細かい処理も可能になっています。今回は、ES2020以降で追加されたPromiseの新機能をユースケースを交えて解説します。 Promiseの基本を簡単におさらい Promiseは、非同
LINE Botの開発でCloudflareとHonoを使う理由
概要 速さが正義 LINE Botの開発でCloudflareとHonoを使う理由 Cloudflare Workersの応答速度が速いから PoPについて CloudflareはAWSのlambdaに比べてポイントオブプレゼンス（PoP）の数が多く、処理が実行される場所がよりユーザーの近くにある可能性が高い。 そのため、パフォーマンステストではAWS Lambda、AWS Lambda@Edgeよりも応答時間が小さいという結果になった。 コールドスタートがない Cloudflare Workersはコールドスタートがなく、LambdaとLambda@EdgeのようにEventBridgeで1分おきにツンツンしなくていい。 Service bindingsが便利だから Cloudflare WorkersのService bindingsを使用することで、worker間の通信はパブリックに
You Don't Need Next.js | ドクセル
[beta] Next.jsクイズ2 • <p>にはなにが表示されるでしょうか？ /app/page.tsx "use client"; import { useCallback, useEffect, useState } from "react"; export default function Home() { const [date, setDate] = useState(); const fetchDate = useCallback(async () => { const response = await fetch("/api"); const data = await response.json(); setDate(data.date); }, []); useEffect(() => { fetchDate(); }, [fetchDate]); return ( <
個人ブログの Next.js v13 移行でやったことまとめ
Next.js v13 への移行でやったことまとめ 準備 基礎となる記事に目を通した -> https://zenn.dev/link/comments/eefa4975aaedaf マイグレーションガイドを見て一つずつ対応しようかなと思ったけど、記事が長いのでnext devで動かして出てきたエラーを潰していく方法にした。とりあえずビルドできるようになったら、見落としやより良いやり方があるか確認するために読む。 ページコンポーネントに対して pages にあるファイルを app ディレクトリに移動させる 規約 通りに page と layout にコンポーネントを分割する getServerSideProps の処理をasync function getData() に変更する コンポーネントを async 関数にする props ではなくコンポーネントの中でgetData()の返り値を
JSの非同期処理を理解するために必要だった知識と学習ロードマップ
はじめに JavaScript の非同期処理を学習してみて「ある程度自信を持って理解できたと言える」状態に到達したので、その感想とまとめの学習ロードマップとその中でどのような知識が必要になるかを紹介したいと思います。 あるいは、自分が実際に学習してきた道筋に基づいているのでショートカットとして参考にしてもらったり、使えるリソースなどの情報が共有できると思います。もしくは「JavaScript 初心者が非同期処理を理解できるようになるまでの道筋」というストーリーで１つのサンプルとして見ていただけるといいかもしれません。 ChangeLog 大きな変更のみをトラッキングしています。 2022-11-16 本の内容を反映させた追記・修正を追加 2022-05-21 構成を修正 「V8 エンジンから考える」の項目を追加 2022-04-30 「イベントループの共通性質」の項目を追加 「ロードマップ
Node.jsのネイティブES Modulesサポートが抱える問題を解決するBabelプラグインを書いた
babel-plugin-node-cjs-interop というパッケージを作ったのでその紹介です。 (GitHub) 何が問題か Node.jsのネイティブES ModulesサポートとBabelやTypeScriptのES Modulesサポートを併用したときに問題が起きます。 ESMとCJS JavaScriptには標準のモジュールシステム (ES Modules, ESM) がありますが、ESMの策定前に先だっていくつかのコミュニティー定義のモジュールシステムが存在していました。そのうちNode.jsを中心として使われていたのがCommonJS Modules (CJS) です。そのNode.js界隈でもESMへの移行が進んでいます。 移行にあたって問題になることのひとつが、ESMとCJSのエクスポートモデルの違いです。 ESMでは、モジュールは0個以上の名前つきエクスポートを定
WHATWG Stream の話
Node学園37時限目で発表した WHATWG Stream の話です。
ブラウザとNode.jsで動く1kBのキーバリューストレージライブラリを書いた
azu/kvsというブラウザとNode.jsで動くファイルサイズが小さいキーバリューストレージを作りました。 モチベーション ファイルサイズが小さくIndexedDBを使っていて、Node.jsでも透過的に同じAPIで利用できるライブラリが必要となったため作りました。 textlint-editorというアプリを書いていて、キャッシュストレージとしてlocalstorage-ponyfillを使っていました。 しかし、localstorage-ponyfillはブラウザとNode.jsで透過的に動くストレージライブラリですが、LocalStorageベースとなっています。 textlint-editorでは、スクリプトをWeb Workerで動かすため同期的なAPIであるLocalStorageは利用できません。 そのため、IndexedDBベースでシンプルなキーバリューストレージを扱える
Node.jsでUnhandled Rejectionsのときにexis statusが0となる問題を回避する
Node.jsでUnhandled Rejectionsが発生してprocessが終了すると、Exit Statusが0となる問題とその対策についてのメモです。 追記： Node.js 15+からUnhandle Rejectionが発生するとプロセスがExit Status 1で終了する動作がデフォルトとなりました Node.js v15ではunhandled rejectionでプロセスがエラー終了する 事前知識: Async FunctionはPromiseを返す関数定義です。 その辺について詳しくは次のサイトを読んでください。 JavaScript Promiseの本 非同期処理:コールバック/Promise/Async Function · JavaScript Primer #jsprimer 今回のサンプルコードは次のリポジトリにあります。 azu/unhandled-rej
TypeORMはNode.js開発のスタンダードになるか？ - Qiita
こんにちはGAOGAOの代表をしております @tejitak です。GAOGAOアドベントカレンダー 17日目の記事です。GAOGAOのスタートアップスタジオにて、最近お手伝いしている海外のお客様案件にてTypeORMを導入しています。 今回の記事では、TypeORMとはなんぞや？という方を対象として、まだ比較的日本語記事が少ないTypeORMについてのご紹介します。 Node.jsのORM Node.jsでサーバーサイドを実装する際にはExpressを使うことが多いと思います。ExpressはサーバーサイドのWebフレームワークで、データベースを扱うORMは自由に導入することができます。以下代表的なORMを紹介します。 mongoose 公式ドキュメント： https://mongoosejs.com/ MongoDBはJavaScriptとの相性の良さから昔からNode.jsの多くのプ
Node.js徹底攻略 ─ ヤフーのノウハウに学ぶ、パフォーマンス劣化やコールバック地獄との戦い方｜ハイクラス転職・求人情報サイト アンビ（AMBI）
Node.js徹底攻略 ─ ヤフーのノウハウに学ぶ、パフォーマンス劣化やコールバック地獄との戦い方 Node.jsをうまく活用できている企業は、どのような方法でベストプラクティスを習得してきたのでしょうか。ヤフー株式会社でNode.jsの社内普及に務めてきた言語サポートチームに、同社の実施を紹介してもらいました。 Node.jsは「イベントループモデルで、ノンブロッキングI/Oを使用している」「問題発生時にHTTP/TCPやPOSIX APIなど低レイヤーの知識を求められる」といった特徴を持つ言語です。開発者が習得すべき技術領域が広いため、Node.jsらしい書き方の学習難易度は高いと言えます。 それでは、Node.jsをうまく活用できている企業は、どのような方法でNode.jsのベストプラクティスを習得してきたのでしょうか。ヤフー株式会社でNode.jsの社内普及に務めてきた言語サポート
Callback を撲滅せよ
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。言語サポート（Node.js）チームの伊藤（@koh110）です。 Node.js v10 も10月にLTSとなり async/await によるフロー制御は当たり前のように利用されるようになってきました。JavaScriptの非同期処理は async/await から覚える人も今後増えていくでしょう。今回はそんな非同期処理について、社内での事例を交えて記事を書いていこうと思います。 index Promise 化がなぜ重要なのか ユーザーに promisify をさせる落とし穴 Road to Promise まとめ Promise 化がなぜ重要なのか ちょうど3年前のアドベントカレンダーで、今後はいろいろなモジュー
MSを偲び、ここにIE6対応SPAの作り方を記す - Qiita
JavaScript2 シェアフル Advent Calendar 2018 10 日目の記事です。 Microsoft EdgeがChromiumベースになるということで賑わっていますので、私も話に乗っかりたいと思い、IE6の話を書くことにしました。 BabelとParcelとHyperappでIE6対応SPA作ってみました デモ: https://boiyaa-ie6-compatible-spa.appspot.com ソース: https://github.com/boiyaa/ie6-compatible-spa これを見ているほとんどのみなさんはIE6を持っていないと思うので、↑を開いてもただの簡素なSPAでしかありませんが。。 記事の最後に載せた画面キャプチャのようになります。 IE6で見る方法 Windows XP マシンを入手するか、BrowserStack の有料プラン
サードパーティJavaScriptの最適化 - 一休.com Developers Blog
本記事は、一休.com Advent Calendar 2018の4日目の記事です。 qiita.com 宇都宮です。宿泊事業本部でWebフロントエンドの開発をしています。 今日は、パフォーマンス改善に取り組むフロントエンドエンジニアの多くが頭を悩ませているであろう、サードパーティスクリプト(3rd Party JavaScript)について書きます。 サードパーティスクリプトとは サードパーティスクリプトとは、外部のドメインから読み込むJavaScriptのことです。典型的には、Google Analytics等のスクリプトが、サードパーティスクリプトに該当します。 一休.comでは、サードパーティスクリプトを、アクセス解析・広告のリターゲティング・A/Bテスト等、様々な用途に使用しています。これらのスクリプトは、一つ一つは小さなものであるため、画面表示のスピードに対するインパクトは意識
Rust と非同期 IO の歴史 - Qiita
この記事は Rust LT #1 で発表したものです 自己紹介 某社でサーバサイド Rust 書いてる 最近のサーバサイド Rust の話題 iron, gotham が開発停止 tokio-core が tokio runtime になった RFCS に async-await が入った futures 0.2 が yank されそう された 疑問 2018 年にもなって非同期 IO で疲弊している Rust は 2006 年に開発が始まった node.js も go も 2009 年には存在していた 今まで Rust は何をやっていたのか？ 今まで Rust は(非同期 IO で)何をやっていたのか？ 2006~2010 この頃の Rust Graydon Hoare が Rust を開発開始 この時代 2006: Firefox2.0, jQuery, Twitter, AWS 20
Promiseに出来てasync/awaitに出来ないこと (JavaScriptを例として) - FOOBAR's Blog
JavaScriptで非同期処理をasync/awaitを使って同期的なスタイルで書いていると、すべてのコードをそのスタイルで統一して書きたくなる。なので非同期処理を開始して実行を明け渡したいときはもちろんawaitを使うし、非同期処理に失敗したときはtry-catch構文で例外ハンドラに制御が移るようにする。ただ、同期的なスタイルで書けない処理が存在するために、どうしてもすべてを統一することはできない。Direct styleで書けないcontrolは継続渡しスタイル(CPS)を使って書くしかないからだ。 JSの場合でいうと、並行制御周りがそれにあたる。Promise.all() や Promise.race() などは対応する構文がJS側に存在しない。 例えば Promise.all() に対応する awaitall みたいな構文が言語側に欲しくなる。こんなふうに: const [x,
Shibu's Diary: 未来のないJavaScriptと非同期とErlang
渋日記@shibu.jp 渋川よしきの日記です。ソフトウェア開発とか、ライフハックを中心に記事を書いていきます。 JavaScriptはもう好き嫌いを超えて、最低限の読み書きはもはや教養レベルといっても言い過ぎではないと思います。ブラウザ限定だったら他の言語もありますが、ブラウザで標準で使える言語はJavaScript以外には選択肢はありません。3DCG系のツールのマクロ言語は未だにPythonがトップシェアだと思いますが、Flash, Photoshop, Illustratorの仕事を効率化するマクロ言語はJavaScriptですよね。先日AppleのOS Xの次期バージョンの自動化ツールが独自言語に加えてJavaScriptをサポートすることを発表しました。サーバサイドで使われるnode.jsは、コンパイル言語を除けばトップクラスの性能です。QtもQMLとしてJavaScriptを中
ayapi.github.io
Hackers Barってなに？ Hackers Bar 六本木にハッカーがおもてなしをするバーが誕生します。 「Hackers Bar」は、ハッカーのプログラミングライブや ビジネスメイキングを楽しむ空間です。 ぁゃしすぎだし、まじで営業してんの！？って半信半疑で行ってみたら、 まじで営業してたｗ 存在してたｗｗｗｗ ぉ店自体のくゎしぃレポゎねとらぼにも載ったみたぃ カクテル名が「ブルースクリーン」「スパゲッティ」って不吉すぎるでしょ！ 六本木にできた「Hackers Bar」行ってきた - ねとらぼ ゃってもらったライブコーディング 弟が、ぁゃぴにソファーをくれるって言ってて、 ゃったーってかんじなんだけど、③人掛けでまじデカぃっぽぃ！ ぉ部屋の㊥ゎだぃじょぶっぽぃんだけど、 運ばれてくる時、マンションのエレベーターにちゃんと入るのかな？ …ってことで、それを計算したくて／(^o^)＼
PerlとJavaScriptとAndroidとiOSとのんのんバアとオレ
そうだったのか！ よくわかる process.nextTick() node.jsのイベントループを理解する
GitHub - tildeio/rsvp.js: A lightweight library that provides tools for organizing asynchronous code
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
