# # Understanding the Package Structure

## # Package introduction

Before version 10.0, Foxit PDF SDK for Web provides three packages as follows:

- Light package: FoxitPDFSDKForWeb_9_XXX_NoFonts.zip (excludes font resources)
- Standard package: FoxitPDFSDKForWeb_9_XXX.zip (includes font resources)
- Full package: FoxitPDFSDKForWeb_9_XXX_Full.zip (includes font resources, document comparison, advanced editor and dynamic XFA)

If you already have the font resources or only want to use online fonts, you can choose the light package if you don't want to make any changes to the font library and don't care about the size of the package, choose the standard package. If you want some advanced features, such as document comparison, advanced editor or dynamic XFA, choose the full package.

Starting from version 10.0, Foxit PDF SDK for Web only provides a full package, with separate authorized features loaded according to the license, and adds 3D feature.

- Full package: FoxitPDFSDKForWeb_10_XXX.zip

The package contains the following folder structure:

Folder | Description
--- | ---
docs | Contains API reference documents and Foxit PDF SDK for Web's developer guide. Note: Our HTML developer guide is built using VuePress, which does not support double-click to open directly. It requires starting an HTTP server and accessing it through a web browser. Additionally, it includes some runnable examples that need WebPDFJRWorker.js enabled which must run in an environment that supports an HTTP server to function correctly.
examples | A series of demos and examples of how to take advantage of all Foxit PDF SDK for Web features.
external | Font resources.
lib | Foxit PDF SDK for Web core libraries.
server | http-server and the Node.js scripts for a series of server-based utility applications to use in the viewer.
legal.txt | Legal and copyright information.
package.json | Project description file.

The `lib` folder's file structure is provided as follows:

Folder/File | Description
--- | ---
jr-engine | Front-end rendering engine.
locales | Internationalized entries data for using the viewer in different languages. Every language is placed in a different directory with its own label.
PDFViewCtrl | Plugins for the PDFViewCtrl library.
stamps | Stamps resources, image files and templates.
assets | Contains the template resource files needed by the document comparison function, currently only included in the full package.
uix-addons | All plugins for the UIExtensions project.
PDFViewCtrl.css | CSS file for the PDFViewCtrl viewer UI style.
PDFViewCtrl.full.js | Complete script file for the PDFViewCtrl viewer library.
PDFViewCtrl.js | Script file for the PDFViewCtrl viewer library without third-party libraries.
PDFViewCtrl.polyfills.js | Browser-adapted polyfill script file for the PDFViewCtrl viewer library.
PDFViewCtrl.vendor.js | Third-party libraries script used by PDFViewCtrl (See the lists later).
preload-jr-worker.js | Worker script for loading resources of JS engine in parallel to the UI for improving the viewer loading speed.
UIExtension.css | The default CSS file of the UI.
UIExtension.dark-variable.css | The style file for dark theme.
UIExtension.vw.css | The CSS file using `vmin` unit.
UIExtension.full.js | Complete script file for the UIExtension full-featured viewer library.
UIExtension.js | Script file for the UIExtension viewer library without third-party libraries
UIExtension.polyfills.js | Browser-adapted polyfill script file for the UIExtensions viewer library.
UIExtension.vendor.js | Third-party libraries script used by UIExtension (See the lists later).
WebPDFJRWorker.js | Script files running in the Web Worker, which are used for calling the front-end rendering engine.
WebPDFSRWorker.js | Script files running in the Web Worker, which are used for calling the server rendering engine.
*.d.ts | "*.d.ts" files are used to provide TypeScript (version 3.3 or higher) with type information about APIs written in JavaScript. The purpose is to enable IDEs to recognize it and provide us with code hints, as well as perform static type checking during compilation, providing convenience while ensuring the accuracy of calling APIs.

## # Static Library and Dynamic Library

Before version 10.0, the underlying library used in Foxit PDF SDK for Web is a static library. From version 10.0, the underlying library used in Foxit PDF SDK for Web is a dynamic library.

## # Division of Dynamic Library Modules

From version 10.0, the dynamic library modules are divided into main module and side module.

Main module:

- gsdk.wasm

Side module: (Lazy loading)

- compare.wasm
- pageeditor.wasm
- touchup.wasm
- xfa.wasm
- 3d.wasm
- lr.wasm
- Pageformat.wasm
- docprocess.wasm

Module Name | Functionality | Dependencies
--- | --- | ---
gsdk.wasm | Wrappers features authorized by the Standard license and Redact. | pageformat.wasm lr.wasm docprocess.wasm
compare.wasm | The Overlay Compare feature, authorized by the Compare license. | lr.wasm
pageeditor.wasm | The Paragraph-based editor (Advanced Editor), authorized by the AdvEditor license. | lr.wasm
touchup.wasm | The EditText and AddText of Advanced editor, authorized by the AdvEditor license. | lr.wasm
xfa.wasm | The dynamic XFA form, authorized by the XFA license. | lr.wasm
3d.wasm | The PDF 3D feature, authorized by the 3D license. | none
lr.wasm | The Layout Recognition engine module provides fundamental support for high-level features. It gets loaded when the related modules depending upon are triggered. | none
Pageformat.wasm | This module gets loaded when the main module is triggered. It provides fundamental codes for the Header&Footer and Watermark features. | none
docprocess.wasm | This module gets loaded when the main module is triggered. It provides fundamental codes for processing article box and web links on the text. | none

## # Package.json

Foxit PDF SDK for Web provides a package.json file to help developers quickly deploy and use the SDK, and make it easy to integrate into their project. The content is as follows:

    {
        "name": "@foxitsoftware/foxit-pdf-sdk-for-web-library",
        "version": "11.0.0",
        "description": "Foxit pdf sdk for web.",
        "author": "Foxit Software Inc.",
        "main": "./lib/UIExtension.full.js",
        "types": "./lib/UIExtension.full.d.ts",
        "typings": "./lib/UIExtension.full.d.ts",
        "scripts": {
            "start": "concurrently --kill-others \"npm run start-http-server\" \"npm run start-snapshot-server\"",
            "start-snapshot-server": "node ./server/snapshot/src/index -p 3002",
            "start-http-server": "node ./server/index"
        },
        "license": "Commercial",
        "devDependencies": {
            "boxen": "^4.1.0",
            "chalk": "^2.4.1",
            "concurrently": "^8.2.2",
            "http-proxy-middleware": "^3.0.0",
            "koa": "^2.7.0",
            "koa-body": "^4.0.4",
            "koa-body-parser": "^1.1.2",
            "koa-cors": "0.0.16",
            "koa-router": "^7.4.0",
            "koa-serve-list": "^1.0.1",
            "koa-static": "^5.0.0",
            "koa2-connect": "^1.0.2",
            "lru-cache": "^4.1.3",
            "raw-body": "^2.3.3",
            "require-dir": "^1.0.0",
            "serve-handler": "^6.0.2",
            "sockjs": "^0.3.21",
            "ws": "^7.3.1"
        },
        "dependencies": {
            "@csstools/normalize.css": "^10.1.0",
            "@types/hammerjs": "^2.0.36",
            "@types/jquery": "^3.3.29",
            "bootstrap-datepicker": "^1.9.0",
            "core-js": "3.35.1",
            "dayjs": "^1.11.1",
            "dayjs-plugin-utc": "^0.1.2",
            "dialog-polyfill": "^0.4.10",
            "dom4": "^2.1.4",
            "es6-promise": "^4.2.5",
            "eventemitter3": "^3.1.0",
            "fast-printf": "^1.6.9",
            "flatpickr": "4.6.9",
            "hammerjs": "^2.0.8",
            "human-format": "^0.11.0",
            "i18next": "^23.8.1",
            "i18next-chained-backend": "^4.6.2",
            "i18next-localstorage-backend": "^4.2.0",
            "i18next-xhr-backend": "^3.2.2",
            "jquery": "^3.4.1",
            "jquery-contextmenu": "^2.7.1",
            "jszip": "^3.7.1",
            "lodash": "^4.17.21",
            "papaparse": "^5.4.1",
            "print-area": "^0.1.4",
            "punycode": "^2.1.1",
            "sortablejs": "~1.9.0",
            "whatwg-fetch": "^3.0.0"
        },
        "resolutions": {
            "jquery": "^3.4.1",
            "core-js": "3.35.1",
            "qs": ">=6.0.4"
        },
        "overrides": {
            "jquery": "^3.4.1",
            "core-js": "3.35.1",
            "qs": ">=6.0.4"
        },
        "serve": {
            "port": 8080,
            "public": "/",
            "proxy": {
                "target": "http://127.0.0.1:3002",
                "changeOrigin": true
            }
        },
        "files": [
            "lib",
            "server",
            "legal.txt",
            "locales_changelog.txt",
            "MigrationNode.txt",
            "ReleaseNote.md"
        ]
    }

## # The third-party libraries used in Foxit PDF SDK for Web

Foxit PDF SDK for Web provides its script files in two versions: the full version script, that includes the third-party libraries, and the regular script, without any third-party libraries. If your project already uses the dependencies included in the SDK's third-party libraries, you don't need to re-install them.

The PDFViewCtrl.full.js script contains:

- PDFViewCtrl.full.js: Complete script file for the PDFViewCtrl viewer library.
- PDFViewCtrl.polyfills.js: Browser-adapted polyfill script file for the PDFViewCtrl viewer library.
- PDFViewCtrl.vendor.js: Third-party libraries script used by PDFViewCtrl (See the list of vendors below this section).
- PDFViewCtrl.js: Script file for the PDFViewCtrl viewer library without third-party libraries.

So, `PDFViewCtrl.polyfills.js` + `PDFViewCtrl.vendor.js` + `PDFViewCtrl.js` = PDFViewCtrl.full.js.

Essentially, the two scripts below are the same thing:

    <script src="../FoxitPDFSDKForWeb/lib/PDFViewCtrl.full.js"></script>

and

    <script src="../FoxitPDFSDKForWeb/lib/ PDFViewCtrl.polyfills.js"></script>
    <script src="../FoxitPDFSDKForWeb/lib/PDFViewCtrl.vendor.js"></script>
    <script src="../FoxitPDFSDKForWeb/lib/PDFViewCtrl.js"></script>

The third-party libraries contained in `PDFViewCtrl.vendor.js` are outlined below:

    jquery
    i18next
    i18next-chained-backend
    i18next-localstorage-backend
    i18next-xhr-backend
    jquery-contextmenu
    dialog-polyfill
    hammerjs
    eventemitter3

The UIExtension.full.js script contains:

- UIExtension.full.js: Complete script file for the UIExtension viewer library.
- UIExtension.polyfills.js: Browser-adapted polyfill script file for the UIExtension viewer library.
- UIExtension.vendor.js: Third-party libraries script used by UIExtension (See the list of vendors below this section).
- UIExtension.js: Script file for the UIExtension viewer library without third-party libraries.

So, `UIExtension.polyfills.js` + `UIExtension.vendor.js` + `UIExtension.js` = UIExtension.full.js.

Essentially, the two scripts below are the same thing:

    <script src="../FoxitPDFSDKForWeb/lib/UIExtension.full.js"></script>

and

    <script src="../FoxitPDFSDKForWeb/lib/UIExtension.polyfills.js"></script>
    <script src="../FoxitPDFSDKForWeb/lib/UIExtension.vendor.js"></script>
    <script src="../FoxitPDFSDKForWeb/lib/UIExtension.js"></script>

The third-party libraries contained in `UIExtension.vendor.js` are outlined below:

    jquery
    i18next
    i18next-chained-backend
    i18next-localstorage-backend
    i18next-xhr-backend
    dialog-polyfill
    hammerjs
    eventemitter3
    file-saver