mirror of
https://github.com/yume-chan/ya-webadb.git
synced 2025-10-06 12:00:16 +02:00
doc: update README and comments
This commit is contained in:
parent
849cb0c7fc
commit
9fc6360032
7 changed files with 54 additions and 17 deletions
|
@ -25,19 +25,19 @@ new ScrcpyOptions1_24({
|
||||||
codecOptions: new CodecOptions({
|
codecOptions: new CodecOptions({
|
||||||
profile: TinyH264Decoder.maxProfile,
|
profile: TinyH264Decoder.maxProfile,
|
||||||
level: TinyH264Decoder.maxLevel,
|
level: TinyH264Decoder.maxLevel,
|
||||||
})
|
}),
|
||||||
})
|
});
|
||||||
```
|
```
|
||||||
|
|
||||||
However, it can fail on some very old devices that doesn't support even Baseline level 4 codec. You can retry without the `codecOptions` option if that happens.
|
However, it can fail on some very old devices that doesn't support even Baseline level 4 codec. You can retry without the `codecOptions` option if that happens.
|
||||||
|
|
||||||
### Render the video
|
### Render the video
|
||||||
|
|
||||||
It draws frames onto `decoder.element` (a `<canvas>` element), you can insert it anywhere you want to display the video.
|
It draws frames onto `decoder.renderer` (a `<canvas>` element), you can insert it anywhere you want to display the video.
|
||||||
|
|
||||||
```ts
|
```ts
|
||||||
const decoder = new TinyH264Decoder();
|
const decoder = new TinyH264Decoder();
|
||||||
document.body.appendChild(decoder.element);
|
document.body.appendChild(decoder.renderer);
|
||||||
|
|
||||||
videoPacketStream // from `@yume-chan/scrcpy`
|
videoPacketStream // from `@yume-chan/scrcpy`
|
||||||
.pipeTo(decoder.writable)
|
.pipeTo(decoder.writable)
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
{
|
{
|
||||||
"name": "@yume-chan/scrcpy-decoder-tinyh264",
|
"name": "@yume-chan/scrcpy-decoder-tinyh264",
|
||||||
"version": "0.0.17",
|
"version": "0.0.17",
|
||||||
"description": "TypeScript implementation of Scrcpy.",
|
"description": "Raw H.264 stream decoder and renderer wrapping TinyH264 and YUVCanvas packages (software decoding).",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
"adb",
|
"adb",
|
||||||
"android-phone",
|
"android-phone",
|
||||||
|
|
|
@ -17,11 +17,11 @@ It has no dependencies and high performance, but is only available on recent ver
|
||||||
|
|
||||||
## Usage
|
## Usage
|
||||||
|
|
||||||
It draws frames onto `decoder.element` (a `<canvas>` element), you can insert it anywhere you want to display the video.
|
It draws frames onto `decoder.renderer` (a `<canvas>` element), you can insert it anywhere you want to display the video.
|
||||||
|
|
||||||
```ts
|
```ts
|
||||||
const decoder = new WebCodecsDecoder();
|
const decoder = new WebCodecsDecoder();
|
||||||
document.body.appendChild(decoder.element);
|
document.body.appendChild(decoder.renderer);
|
||||||
|
|
||||||
videoPacketStream // from `@yume-chan/scrcpy`
|
videoPacketStream // from `@yume-chan/scrcpy`
|
||||||
.pipeTo(decoder.writable)
|
.pipeTo(decoder.writable)
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
{
|
{
|
||||||
"name": "@yume-chan/scrcpy-decoder-webcodecs",
|
"name": "@yume-chan/scrcpy-decoder-webcodecs",
|
||||||
"version": "0.0.17",
|
"version": "0.0.17",
|
||||||
"description": "TypeScript implementation of Scrcpy.",
|
"description": "Raw H.264 stream decoder and renderer using WebCodecs API (requires modern browser).",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
"adb",
|
"adb",
|
||||||
"android-phone",
|
"android-phone",
|
||||||
|
|
|
@ -1,8 +1,40 @@
|
||||||
# @yume-chan/stream-extra
|
# @yume-chan/stream-extra
|
||||||
|
|
||||||
Some useful extensions for Web Streams API.
|
Some useful extensions for working with binary streams. Conforms to the [Web Streams API](https://streams.spec.whatwg.org/).
|
||||||
|
|
||||||
Currently it's using [web-streams-polyfill](https://github.com/MattiasBuelens/web-streams-polyfill) because it's hard to load native implementations from both browsers and Node.js. (An experimental implementation using Top Level Await is available in `native.ts`, but not exported).
|
## Find an implementation
|
||||||
|
|
||||||
|
If all of `ReadableStream`, `WritableStream` and `TransformStream` fields are available on `globalThis`, they will be used. Otherwise, the [web-streams-polyfill](https://github.com/MattiasBuelens/web-streams-polyfill) package will be used.
|
||||||
|
|
||||||
|
Google Chrome 89 and Mozilla Firefox 102 provide full support for Web Streams API natively.
|
||||||
|
|
||||||
|
In Node.js, it's not possible to load the `stream/web` module while keeping the compatibility with both Web and bundlers:
|
||||||
|
|
||||||
|
- Webpack has poor support with Top Level Await, for example, Hot Module Replacement doesn't work when any module is using TLA.
|
||||||
|
- Web doesn't have the `module` module, thus requires a shim in import map.
|
||||||
|
|
||||||
|
Assigning `ReadableStream`, `WritableStream` and `TransformStream` from `stream/web` module to `globalThis`, before loading this library, will still work. Other custom polyfill can also be loaded this way.
|
||||||
|
|
||||||
|
## Compatibility issue with `ReadableStream#pipeTo` and `ReadableStream#pipeThrough`
|
||||||
|
|
||||||
|
The [Web Streams API spec](https://streams.spec.whatwg.org/#readable-stream-pipe-to) specifies that `ReadableStream#pipeTo` must check the argument to be an instance of `WritableStream`, so it can optimize the performance by calling internal methods directly.
|
||||||
|
|
||||||
|
Native implementations will perform this check, so `new globalThis.ReadableStream().pipeTo(new Polyfill.WritableStream())` will throw an error.
|
||||||
|
|
||||||
|
The `WrapReadableStream` class can be used to bypass this check:
|
||||||
|
|
||||||
|
```ts
|
||||||
|
import { WrapReadableStream } from "@yume-chan/stream-extra";
|
||||||
|
import { WritableStream as PolyfillWritableStream } from "web-streams-polyfill";
|
||||||
|
|
||||||
|
const nativeReadable = new globalThis.ReadableStream();
|
||||||
|
const wrappedReadable = new WrapReadableStream(new globalThis.ReadableStream());
|
||||||
|
|
||||||
|
nativeReadable.pipeTo(new PolyfillWritableStream()); // Error
|
||||||
|
wrappedReadable.pipeTo(new PolyfillWritableStream()); // OK
|
||||||
|
```
|
||||||
|
|
||||||
|
web-streams-polyfill package's `ReadableStream#pipeTo` only uses public methods, so it can be used with any `WritableStream` implementation.
|
||||||
|
|
||||||
## `BufferedReadableStream`
|
## `BufferedReadableStream`
|
||||||
|
|
||||||
|
|
|
@ -46,9 +46,9 @@ export class BufferedTransformStream<T>
|
||||||
const value = await transform(buffered);
|
const value = await transform(buffered);
|
||||||
controller.enqueue(value);
|
controller.enqueue(value);
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
// TODO: BufferedTransformStream: The semantic of stream ending is not clear
|
// Treat `BufferedReadableStreamEndedError` as a normal end.
|
||||||
// If the `transform` started but did not finish, it should really be an error?
|
// If the `transform` method doesn't have enough data to return a value,
|
||||||
// But we can't detect that, unless there is a `peek` method on buffered stream.
|
// it should throw another error to indicate that.
|
||||||
if (e instanceof BufferedReadableStreamEndedError) {
|
if (e instanceof BufferedReadableStreamEndedError) {
|
||||||
controller.close();
|
controller.close();
|
||||||
return;
|
return;
|
||||||
|
|
|
@ -50,6 +50,11 @@ export namespace NumberFieldType {
|
||||||
signed: false,
|
signed: false,
|
||||||
size: 2,
|
size: 2,
|
||||||
deserialize(array, littleEndian) {
|
deserialize(array, littleEndian) {
|
||||||
|
// PERF: Chrome's `DataView#getUint16` uses inefficient operations,
|
||||||
|
// including branching, bit extending and 32-bit bit swapping.
|
||||||
|
// The best way should use 16-bit bit rotation and conditional move,
|
||||||
|
// like LLVM does for code similar to the below one.
|
||||||
|
// This code is much faster on V8, but the actual generated assembly is unknown.
|
||||||
return (
|
return (
|
||||||
(((array[1]! << 8) | array[0]!) * (littleEndian as any)) |
|
(((array[1]! << 8) | array[0]!) * (littleEndian as any)) |
|
||||||
(((array[0]! << 8) | array[1]!) * (!littleEndian as any))
|
(((array[0]! << 8) | array[1]!) * (!littleEndian as any))
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue