Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions _includes/sidelist-programming/programming-javascript.html
Original file line number Diff line number Diff line change
Expand Up @@ -1642,6 +1642,10 @@
<a href="{{ site.js }}faq/camera-cannot-open-in-pwa.html"
>How to Resolve Camera Cannot Open in PWA Using Dynamsoft Barcode Reader on iOS?</a>
</li>
<li>
<a href="{{ site.js }}faq/adaptive-wasm-loading.html"
>What Is Adaptive WebAssembly (Wasm) Loading and How Does It Work?</a>
</li>
</ul>
</li>
<li lang="javascript"><a href="{{ site.license_activation }}index.html" class="otherLinkColour">License Initialization</a></li>
Expand Down
5 changes: 4 additions & 1 deletion _includes/sidelist-programming/sidelist-parameters.html
Original file line number Diff line number Diff line change
Expand Up @@ -266,7 +266,9 @@
<li><a href="{{ site.dcvb_parameters }}barcode-format-specification/enable-addon-code.html" class="otherLinkColour">EnableAddOnCode</a></li>
<li><a href="{{ site.dcvb_parameters }}barcode-format-specification/enable-data-matrix-ecc000-140.html" class="otherLinkColour">EnableDataMatrixECC000-140</a></li>
<li><a href="{{ site.dcvb_parameters }}barcode-format-specification/enable-qr-code-model-1.html" class="otherLinkColour">EnableQRCodeModel1</a></li>
<li><a href="{{ site.dcvb_parameters }}barcode-format-specification/expected-barcodes-count.html" class="otherLinkColour">ExpectedBarcodesCount</a></li>
<li><a href="{{ site.dcvb_parameters }}barcode-format-specification/find-uneven-module-barcode.html" class="otherLinkColour">FindUnevenModuleBarcode</a></li>
<li><a href="{{ site.dcvb_parameters }}barcode-format-specification/has-vertical-quietzone.html" class="otherLinkColour">HasVerticalQuietZone</a></li>
<li><a href="{{ site.dcvb_parameters }}barcode-format-specification/head-module-ratio.html" class="otherLinkColour">HeadModuleRatio</a></li>
<li><a href="{{ site.dcvb_parameters }}barcode-format-specification/include-implied-ai01.html" class="otherLinkColour">IncludeImpliedAI01</a></li>
<li><a href="{{ site.dcvb_parameters }}barcode-format-specification/include-trailing-check-digit.html" class="otherLinkColour">IncludeTrailingCheckDigit</a></li>
Expand Down Expand Up @@ -299,7 +301,8 @@
</li>
<li><a href="{{ site.dcvb_parameter_file }}auxiliary/global-parameter.html" class="otherLinkColour">Global Parameter</a>
<ul>
<li><a href="{{ site.dcvb_parameters }}global-parameter/max-total-image-dimension.html" class="otherLinkColour">MaxTotalImageDimension</a></li>
<li><a href="{{ site.dcvb_parameters_file }}auxiliary/global-parameter.html#maxtotalimagedimension" class="otherLinkColour">MaxTotalImageDimension</a></li>
<li><a href="{{ site.dcvb_parameters_file }}auxiliary/global-parameter.html#intraopnumthreads" class="otherLinkColour">IntraOpNumThreads</a></li>
</ul>
</li>
<li><a href="{{ site.dcvb_parameter_file }}semantic-processing/index.html" class="otherLinkColour">SemanticProcessing Object</a>
Expand Down
4 changes: 2 additions & 2 deletions programming/javascript/api-reference/barcode-scanner.md
Original file line number Diff line number Diff line change
Expand Up @@ -178,7 +178,7 @@ interface BarcodeScannerConfig {
// engineResourcePaths typically is only assigned when using a framework like React/Angular/Vue where the resources are not in the same location as the script reference.
engineResourcePaths: {rootDirectory:"https://cdn.jsdelivr.net/npm/"},
// path to the UI file
uiPath: "https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.0.6000/dist/ui/barcode-scanner.ui.xml",
uiPath: "https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.2.2000/dist/ui/barcode-scanner.ui.xml",
barcodeFormats: [Dynamsoft.DBR.EnumBarcodeFormat.BF_QR_CODE , Dynamsoft.DBR.EnumBarcodeFormat.BF_CODE_128],
showPoweredByDynamsoft: false,
duplicateForgetTime: 3000,
Expand All @@ -187,7 +187,7 @@ interface BarcodeScannerConfig {
// The container for rendering the scanner and/or result view. Note that ResultView is only valid for SM_MULTI_UNIQUE mode. If not specified, a full-viewport default UI will be created.
container: "#camera-view-container",
scannerViewConfig: {
// The ResultViewConfig goes in here - see ResultViewConfig section
// The ScannerViewConfig goes in here - see ScannerViewConfig section
},
resultViewConfig: {
// The ResultViewConfig goes in here - see ResultViewConfig section
Expand Down
30 changes: 16 additions & 14 deletions programming/javascript/api-reference/enum-localization-mode.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,29 +20,31 @@ codeAutoHeight: true
>
```javascript
enum EnumLocalizationMode {
/** Omits the localization process entirely. */
LM_SKIP = 0x00,
/** Automatic localization mode selection; not yet implemented. */
LM_AUTO = 0x01,
LM_AUTO = 1,
/** Identifies barcodes by finding connected blocks, offering optimal results, especially recommended for highest priority in most scenarios. */
LM_CONNECTED_BLOCKS = 0x02,
LM_CONNECTED_BLOCKS = 2,
/** Detects barcodes through analysis of patterns of contiguous black and white regions, tailored for QR Codes and DataMatrix codes. */
LM_STATISTICS = 0x04,
LM_STATISTICS = 4,
/** Locates barcodes by identifying linear patterns, designed primarily for 1D barcodes and PDF417 codes. */
LM_LINES = 0x08,
LM_LINES = 8,
/** Provides rapid barcode localization, suited for interactive applications where speed is crucial. */
LM_SCAN_DIRECTLY = 0x10,
LM_SCAN_DIRECTLY = 16,
/** Targets barcode localization through detection of specific mark groups, optimized for Direct Part Marking (DPM) codes. */
LM_STATISTICS_MARKS = 0x20,
LM_STATISTICS_MARKS = 32,
/** Combines methods of locating connected blocks and linear patterns to efficiently localize postal codes. */
LM_STATISTICS_POSTAL_CODE = 0x40,
LM_STATISTICS_POSTAL_CODE = 64,
/** Initiates barcode localization from the image center, facilitating faster detection in certain layouts. */
LM_CENTRE = 0x80,
LM_CENTRE = 128,
/** Specialized for quick localization of 1D barcodes, enhancing performance in fast-scan scenarios. */
LM_ONED_FAST_SCAN = 0x100,
/** Placeholder value with no functional meaning. */
LM_END=0xFFFFFFFF,
LM_ONED_FAST_SCAN = 256,
/**Localizes barcodes by utilizing a neural network model. Introduced in Dynamsoft Barcode Reader Bundle version 11.2.2000. */
LM_NEURAL_NETWORK = 512,
/** Reserved for future use in localization mode settings. */
LM_REV = -2147483648
LM_REV = -2147483648,
/** Omits the localization process entirely. */
LM_SKIP = 0,
/** Placeholder value with no functional meaning. */
LM_END = -1
}
```
Binary file added programming/javascript/assets/return-button.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
81 changes: 81 additions & 0 deletions programming/javascript/faq/adaptive-wasm-loading.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,81 @@
---
layout: default-layout
title: About Adaptive WebAssembly (Wasm) Loading
keywords: Dynamsoft Barcode Reader, FAQ, JavaScript, tech basic, wasm, loading
description: How to enable -SIMD-Pthread Wasm for accelerated deep learning computation?
needAutoGenerateSidebar: false
---

# About Adaptive WebAssembly (Wasm) Loading

## What is adaptive Wasm loading?

Dynamsoft Barcode Reader(JavaScript) includes **three optimized WebAssembly (Wasm) variants** — *-Baseline*, *-Pthread*, and *-SIMD-Pthread* — which can be **dynamically loaded based on the runtime environment**.
This adaptive loading mechanism ensures the SDK automatically selects the **most compatible and highest-performing** Wasm module available in each browser, further improving performance in modern environments.

---

## Comparison of the three Wasm variants

| Feature | Baseline Wasm | SIMD Wasm | SIMD + Pthread Wasm |
| -------- | -------------- | ---------- | -------------------- |
| **Parallelism** | Single-threaded | Single Instruction Multiple Data (CPU vector instruction set) | Multi-threaded(via Web Workers + SharedArrayBuffer) + SIMD |
| **Performance Characteristics** | Simple, limited by single-core performance | Leverages CPU vectorized parallelism to speed up data processing | Combines SIMD vectorization and multi-core acceleration for maximum performance |
| **Compatibility** | Supported in all Wasm environments | Requires browser support for Wasm SIMD instruction set | Requires browser support for both Wasm SIMD and Wasm threads (cross-origin isolation) |
| **Minimum Supported Browser Versions** | Chrome 78+<br>Edge 79+<br>Safari 14.5+<br>Firefox 68+ | Chrome 91+<br>Edge 91+<br>Safari 16.4+<br>Firefox 89+ | Chrome 91+<br>Edge 91+<br>Safari 16.4+<br>Firefox 89+ |
| **Wasm Size** | 5588 KB | 6974 KB | 8225 KB |
| **Transfer Size** | 2.11 MB | 2.55 MB | 2.81 MB |

---

## How to enable -SIMD-Pthread Wasm for accelerated deep learning computation?

To unlock multi-threaded performance with the **-SIMD-Pthread Wasm** variant, configure your server to enable **cross-origin isolation** by adding the following HTTP headers to all responses:

```text
Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp
```

Then, ensure that all SDK resources are **served under the same origin**.

Once correctly configured, the SDK will automatically detect the environment and load the `-SIMD-Pthread Wasm` to leverage multi-core acceleration.

>[!TIP]
>You can verify whether your site is correctly isolated by checking the browser console for cross-origin isolation status or by calling window.crossOriginIsolated in DevTools.

## How to manually specify which Wasm variant to load?

By default, the SDK automatically determines the most suitable WebAssembly (Wasm) variant to load based on the browser’s capabilities.
However, developers can **manually override** this behavior and explicitly specify which Wasm module to load through the `wasmLoadOptions` property.

### Example

```javascript
Dynamsoft.Core.CoreModule.wasmLoadOptions = {
wasmType: "ml-simd-pthread",
pthreadPoolSize: 5,
};
```

### Supported Wasm Types

```javascript
type WasmType =
| "baseline" // Basic single-threaded variant
| "ml-simd" // SIMD-optimized variant
| "ml-simd-pthread" // Multi-threaded + SIMD optimized variant
| "auto"; // Automatically select based on environment
```

>[!NOTE]
>Setting wasmType to "auto" (default) allows the SDK to automatically choose the optimal Wasm based on runtime capability detection.
>
>When using "ml-simd-pthread", ensure that cross-origin isolation is properly configured as described in [How to enable `-SIMD-Pthread Wasm` for accelerated deep learning computation](#how-to-enable--simd-pthread-wasm-for-accelerated-deep-learning-computation).
>
>If the specified Wasm variant is not supported in the current browser, the SDK will gracefully fall back to a compatible variant.

## Why isn’t -SIMD-Pthread Wasm enabled by default on iOS?

Due to iOS’s strict memory allocation and management limitations, loading `-SIMD-Pthread Wasm` can sometimes lead to “out of memory” errors on older devices or iOS versions.
To ensure stability and compatibility, the SDK does not load `-SIMD-Pthread Wasm` by default on iOS. Instead, it automatically falls back to the most suitable Baseline or SIMD variant depending on the environment.
4 changes: 3 additions & 1 deletion programming/javascript/faq/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -87,4 +87,6 @@ noTitleIndex: true

39. [How to Enable Specific Barcode Formats with Your License?](enable-supported-barcode-format.html)

40. [How to Resolve Camera Cannot Open in PWA Using Dynamsoft Barcode Reader on iOS](camera-cannot-open-in-pwa.html)
40. [How to Resolve Camera Cannot Open in PWA Using Dynamsoft Barcode Reader on iOS?](camera-cannot-open-in-pwa.html)

41. [What Is Adaptive WebAssembly (Wasm) Loading and How Does It Work?](adaptive-wasm-loading.md)
1 change: 1 addition & 0 deletions programming/javascript/release-notes/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ breadcrumbText: Release Notes

# DBR JavaScript SDK - Release Notes

- [11.2.2000 (11/04/2025)](js-11.html#1122000-11042025)
- [11.0.6000 (08/14/2025)](js-11.html#1106000-08142025)
- [11.0.3000 (07/09/2025)](js-11.html#1103000-07092025)
- [10.5.3000 (04/24/2025)](js-10.html#1053000-04242025)
Expand Down
63 changes: 63 additions & 0 deletions programming/javascript/release-notes/js-11.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,69 @@ noTitleIndex: true

# Release Notes for Dynamsoft Barcode Reader JavaScript SDK

## 11.2.2000 (11/04/2025)

### ✨ Key Highlights
#### AI-Powered Barcode Detection and Decoding

- New Localization Models – Introduces [`OneDLocalization`]({{ site.dcvb_parameters }}barcode-reader-task-settings/localization-modes.html#modelnamearray) and [`DataMatrixQRCodeLocalization`]({{ site.dcvb_parameters }}barcode-reader-task-settings/localization-modes.html#modelnamearray) neural network models for improved detection of **blurred / low-resolution 1D codes**, or **partially damaged DataMatrix/QR codes**.
- Specialized Decoders – Adds [`EAN13Decoder`]({{ site.dcvb_parameters }}barcode-reader-task-settings/deblur-modes.html#modelnamearray) and [`Code128Decoder`]({{ site.dcvb_parameters }}barcode-reader-task-settings/deblur-modes.html#modelnamearray) models optimized for **long-distance** and **motion-blurred** decoding scenarios.
- Redesigned Deblur Model – The [`OneDDeblur`]({{ site.dcvb_parameters }}barcode-reader-task-settings/deblur-modes.html#modelnamearray) model now provides more effective recovery from **motion and focus blur**.
- Configurable Model Selection – The new `ModelNameArray` parameter supports flexible model loading and fine-grained control for specific barcode types.

#### Precision and Processing Control

- Enhanced Deblur Methods – [`DM_DEEP_ANALYSIS`]({{ site.dcvb_parameters }}barcode-reader-task-settings/deblur-modes.html#dm_deep_analysis) now includes sub-level control with `OneDGeneral`, `TwoDGeneral`, and `EAN13Enhanced` options.
- Barcode Count Expectation – The new [`ExpectedBarcodesCount`]({{ site.dcvb_parameters }}barcode-format-specification/expected-barcodes-count.html) parameter enables **format-specific quantity control** and **early termination** in fixed-count workflows.
- Improved Region Detection – The new [`RPM_GRAY_CONSISTENCY`]({{ site.dcvb_parameters }}image-parameter/region-predetection-modes.html#rpm_gray_consistency) mode provides more precise region extraction based on **grayscale uniformity** and **local consistency** for document and label processing.

### Performance Highlights

- Up to **26.5%** higher read rates under blur conditions with as much as **44%** faster processing.
- Reliable decoding of DataMatrix and QR codes with missing or damaged finder patterns.
- Extended operational range beyond 75 cm for long-distance barcode scanning.

### Developer Notes

- Backward Compatibility – Fully compatible with existing integrations; no code-level changes required for upgrade.
- Configuration Flexibility – Expanded parameter set allows comprehensive model configuration for scenario-specific tuning.
- Production Stability – All new models validated in enterprise environments.

#### Updates for [BarcodeScanner](https://dynamsoft.com/barcode-reader/docs/web/programming/javascript/api-reference/barcode-scanner.html)

- In **single** mode, if the target barcode is not found among the candidates, there is now an opportunity to rescan.
<img src="../assets/return-button.png" style="display: block; margin: 0 auto;"/>
- Fixed an issue where the barcode location could be inaccurate in certain cases.
- Fixed a problem where, in specific cases when the camera was occupied, the video stream could not be displayed correctly.
- Other known issues fixed.

#### Engineering Optimizations

- Optimized the parallel download logic to improve resource loading speed.
- Optimized [adaptive WASM loading logic](../faq/adaptive-wasm-loading.md) to further enhance performance in modern browser environments.

### API Changes

#### New

- Added the `switchCapturingTemplate()` method to the `CaptureVisionRouter` class to enable switching the active capturing template during the image processing workflow.
- Added methods `toBlob()`, `toImage()`, and `toCanvas()` to the `originalImageResultItem` interface for flexible image data conversion.
- Added the `SetGlobalIntraOpNumThreads()` method to the `CaptureVisionRouter` class to configure the global thread count for model inference.
- Added the `clearDLModelBuffers()` method to the `CaptureVisionRouter` class to manually release memory occupied by loaded models.
- Added callback functions `onSpecLoadProgressChanged()` and `onWasmLoadProgressChanged()` to monitor resource loading progress.
- Added the `convertToContainCoordinates()` method to the `CameraEnhancer` class to convert coordinates from `fit: cover` to `fit: contain` mode.
- Added the `LM_NEURAL_NETWORK` enumeration to `EnumLocalizationMode`.

#### Updated

- Changed the default value of `MaxThreadsInOneTask` from **4** to **0**.
- Changed the default value of `IncludeTrailingCheckDigit` from **1** to **0**.

#### Deprecated

- Deprecated the `DeblurModelNameArray` argument in the `DeblurModes` parameter. Use `ModelNameArray` instead.
- Deprecated the `appendModelBuffer()` method in the `CaptureVisionRouter` class. Use `appendDLModelBuffer()` instead.

## 11.0.6000 (08/14/2025)

### New
Expand Down
6 changes: 3 additions & 3 deletions programming/javascript/samples-demos/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -112,6 +112,9 @@ needAutoGenerateSidebar: false
templates for scanning various barcode types."><a class="button title" href="https://demo.dynamsoft.com/Samples/DBR/JS/barcode-scanner-api-samples/scan-single-barcode/use-customized-template/index.html">Use Customized Template</a><span id="icon001" class="tooltipIcon"></span>
<a class="github" href="https://github.com/Dynamsoft/barcode-reader-javascript-samples/blob/main/barcode-scanner-api-samples/scan-single-barcode/use-customized-template/index.html" title="Check code on GitHub"></a></span>
</div>
<div class="file"><span data-balloon-length="large" data-balloon-pos="up" aria-label="Read the GS1-AI barcode and parse it."><a class="button title" href="https://demo.dynamsoft.com/Samples/DBR/JS/barcode-scanner-api-samples/scan-single-barcode/read-and-parse-GS1-AI/index.html">Read the GS1-AI Barcode and Parse It</a><span id="icon042" class="tooltipIcon"></span>
<a class="github" href="https://github.com/Dynamsoft/barcode-reader-javascript-samples/blob/main/barcode-scanner-api-samples/scan-single-barcode/read-and-parse-GS1-AI/index.html" title="Check code on GitHub"></a></span>
</div>
<div class="file"><span data-balloon-length="large" data-balloon-pos="down" aria-label="Read barcodes from camera and images in Angular
Application."><a class="button title" href="https://github.com/Dynamsoft/barcode-reader-javascript-samples/tree/main/barcode-scanner-api-samples/scan-single-barcode/angular">Hello World in
Angular (<img alt="Angular logo"
Expand Down Expand Up @@ -378,9 +381,6 @@ needAutoGenerateSidebar: false
<div class="file"><span data-balloon-length="large" data-balloon-pos="up" aria-label="Locate an item quickly by scanning barcodes."><a class="button title" href="https://demo.dynamsoft.com/Samples/DBR/JS/foundational-api-samples/use-case/locate-an-item-with-barcode/index.html">Find Item via Barcode</a><span id="icon042" class="tooltipIcon"></span>
<a class="github" href="https://github.com/Dynamsoft/barcode-reader-javascript-samples/blob/main/foundational-api-samples/use-case/locate-an-item-with-barcode/index.html" title="Check code on GitHub"></a></span>
</div>
<div class="file"><span data-balloon-length="large" data-balloon-pos="up" aria-label="Read the GS1-AI barcode and parse it."><a class="button title" href="https://demo.dynamsoft.com/Samples/DBR/JS/foundational-api-samples/use-case/read-and-parse-GS1-AI/index.html">Read the GS1-AI Barcode and Parse It</a><span id="icon042" class="tooltipIcon"></span>
<a class="github" href="https://github.com/Dynamsoft/barcode-reader-javascript-samples/blob/main/foundational-api-samples/use-case/read-and-parse-GS1-AI/index.html" title="Check code on GitHub"></a></span>
</div>
</div>
<div class="file">Others</div>
<div class="children">
Expand Down
2 changes: 1 addition & 1 deletion programming/javascript/upgrade-guide/10to11.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ permalink: /programming/javascript/upgrade-guide/10to11.html
To use version 11, include the following script in your HTML:

```html
<script src="https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.0.6000/dist/dbr.bundle.js"></script>
<script src="https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.2.2000/dist/dbr.bundle.js"></script>
```

## APIs changes introduced in v11
Expand Down
Binary file modified programming/javascript/user-guide/assets/updateBarcodeFormat.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading