diff --git a/README.md b/README.md
index e03a07b..8701fe2 100644
--- a/README.md
+++ b/README.md
@@ -15,13 +15,6 @@ While this does require some additional CPU and memory at the point of creating
* Smaller code as the internal properties and methods when defined within the instance can be minified.
* As the resulting generated code can be better minified this *should* result in a smaller minified result and therefore better load times for your users.
-## When to use
-While this helper was originally created to support better minification for generated code via TypeScript, it is not limited to only being used from within TypeScript.
-
-And as with including any additional code into your project there is a trade off that you need to make before using this helper which is the size of the additional code of this utility vs the minification gains that *may* be obtained. As in most cases of creating JavaScript code for better minfication if your code doesn't expose or provide a lot of public methods or only uses un-minifiable "names" less than 2 times then the potential gains may not be worth the additional bytes.
-
-And yes at the end of the day, if you are creating JS classes directly in Javascript you *should* be able to create a simplier one-off solution that would result in smaller output as this project needs to be generic to be able to support all use-cases.
-
## Basic Usage
```typescript
import dynamicProto from "@microsoft/dynamicproto-js";
@@ -84,12 +77,87 @@ If you are changing package versions or adding/removing any package dependencies
## Performance
-The minified version of this adds a negligible amount of code and loadtime to your source code and by using this library your generated code can be better minified as it removes most references of Classname.prototype.XXX methods from the generated code.
+The minified version of this adds a negligible amount of code and loadtime to your source code and by using this library, your generated code can be better minified as it removes most references of Classname.prototype.XXX methods from the generated code.
> Summary:
>
> - **~2 KB** minified (uncompressed)
+## Example usage and resulting minified code
+
+In this first example of code that is typically emitted by TypeScript it contains several references to the Classname.prototype and "this" references, both of which cannot be minfied.
+
+```Javascript
+var NormalClass = /** @class */ (function () {
+ function NormalClass() {
+ this.property1 = [];
+ this.property1.push("Hello");
+ }
+ InheritTest1.prototype.function1 = function () {
+ //...
+ doSomething();
+ };
+ InheritTest1.prototype.function2 = function () {
+ //...
+ doSomething();
+ };
+ InheritTest1.prototype.function3 = function () {
+ //...
+ doSomething();
+ };
+ return NormalClass;
+}());
+```
+
+So the result would look something like this which represents a ~45% compression, note that the Classname.prototype appears several times.
+
+```JavaScript
+var NormalClass=(InheritTest1.prototype.function1=function(){doSomething()},InheritTest1.prototype.function2=function(){doSomething()},InheritTest1.prototype.function3=function(){doSomething()},function(){this.property1=[],this.property1.push("Hello")});
+```
+
+While in this example when using the dynamicProto helper to create the same resulting class and objects there are no references to Classname.prototype and only 1 reference to this.
+
+```JavaScript
+var DynamicClass = /** @class */ (function () {
+ function DynamicClass() {
+ dynamicProto(DynamicClass, this, function (_self, base) {
+ _self.property1 = [];
+ _self.property1.push("Hello()");
+ _self.function1 = function () {
+ //...
+ doSomething();
+ };
+ _self.function1 = function () {
+ //...
+ doSomething();
+ };
+ _self.function1 = function () {
+ //...
+ doSomething();
+ };
+ });
+ }
+ return DynamicClass;
+}());
+```
+
+Which results in the following minified code which is much smaller and represents ~63% compression.
+
+```Javascript
+var DynamicClass=function n(){dynamicProto(n,this,function(n,o){n.property1=[],n.property1.push("Hello()"),n.function1=function(){doSomething()},n.function1=function(){doSomething()},n.function1=function(){doSomething()}})};
+```
+
+ So when looking at the code for NormalClass and DynamicClass, both end up with 1 instance property called ```property1``` and the 3 functions ```function1```, ```function2``` and ```function3```, in both cases the functions are defined ONLY on the "class" prototype and ```property1``` is defined on the instance. So anyone, whether using JavaScript or TypeScript will be able to "extend" either of class without any concerns about overloading instance functions and needing to save any previous method. And you are extending a 3rd party library you no longer have to worry about them changing the implementation as ```dynamicProto()``` handles converting overriden instance functions into prototype level ones. Yes, this means that if you don't override instance function it will continue to be an instance function.
+
+## When to use
+
+While this helper was created to support better minification for generated code via TypeScript code, it is not limited to only being used from within TypeScript, you can use the helper function directly in the same way as the examples above.
+
+As with including any additional code into your project there are trade offs that you need to make, including if you are looking at this helper, one of the primary items is the overall size of the additional code that you will be including vs the minification gains that you *may* obtained. This project endeavours to keep it's impact (bytes) as small as possible while supporting you to create readable and maintainable code that will create a smaller minified output.
+
+In most cases when creating JavaScript to support better minfication, when your code doesn't expose or provide a lot of public methods or only uses un-minifiable "names" less than 2 times, then you may not see enough potential gains to counteract the additional bytes required from the helper code. However, for any significant project you should.
+
+So at the end of the day, if you are creating JS classes directly you *should* be able to create a simplier one-off solution that would result in smaller output (total bytes). This is how this project started, but, once we had several of these one-off solutions it made more sense to build it once.
## Browser Support
@@ -97,10 +165,6 @@ The minified version of this adds a negligible amount of code and loadtime to yo
--- | --- | --- | --- | --- | --- |
Latest ✔ | Latest ✔ | 8+ Full ✔ | Latest ✔ | Latest ✔ | Latest ✔ |
-## Contributing
-
-Read our [contributing guide](./CONTRIBUTING.md) to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to Application Insights.
-
## ES3/IE8 Compatibility
As an library there are numerous users which cannot control the browsers that their customers use. As such we need to ensure that this library continues to "work" and does not break the JS execution when loaded by an older browser. While it would be ideal to just not support IE8 and older generation (ES3) browsers there are numerous large customers/users that continue to require pages to "work" and as noted they may or cannot control which browser that their end users choose to use.
@@ -128,3 +192,7 @@ This table does not attempt to include ALL of the ES3 unsuported features, just
| ```Object.isSealed(obj)``` | Not provided by ES3 and not used | N/A |
| ```Object.freeze(obj)``` | Not provided by ES3 and not used | N/A |
| ```Object.isFrozen(obj)``` | Not provided by ES3 and not used | N/A |
+
+## Contributing
+
+Read our [contributing guide](./CONTRIBUTING.md) to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to Application Insights.
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 6c0a0ca..2341b82 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -12,6 +12,21 @@
"from": "@babel/highlight@^7.0.0",
"resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.5.0.tgz"
},
+ "@nodelib/fs.scandir": {
+ "version": "2.1.3",
+ "from": "@nodelib/fs.scandir@2.1.3",
+ "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.3.tgz"
+ },
+ "@nodelib/fs.stat": {
+ "version": "2.0.3",
+ "from": "@nodelib/fs.stat@^2.0.2",
+ "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.3.tgz"
+ },
+ "@nodelib/fs.walk": {
+ "version": "1.2.4",
+ "from": "@nodelib/fs.walk@^1.2.3",
+ "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.4.tgz"
+ },
"@rush-temp/dynamicproto-js": {
"version": "0.0.0",
"from": "projects\\dynamicproto-js.tgz",
@@ -22,6 +37,26 @@
"from": "@types/estree@0.0.39",
"resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz"
},
+ "@types/events": {
+ "version": "3.0.0",
+ "from": "@types/events@*",
+ "resolved": "https://registry.npmjs.org/@types/events/-/events-3.0.0.tgz"
+ },
+ "@types/fs-extra": {
+ "version": "8.0.1",
+ "from": "@types/fs-extra@^8.0.0",
+ "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-8.0.1.tgz"
+ },
+ "@types/glob": {
+ "version": "7.1.1",
+ "from": "@types/glob@^7.1.1",
+ "resolved": "https://registry.npmjs.org/@types/glob/-/glob-7.1.1.tgz"
+ },
+ "@types/minimatch": {
+ "version": "3.0.3",
+ "from": "@types/minimatch@*",
+ "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz"
+ },
"@types/node": {
"version": "12.12.7",
"from": "@types/node@*",
@@ -101,6 +136,11 @@
"from": "array-slice@>=1.0.0 <2.0.0",
"resolved": "https://registry.npmjs.org/array-slice/-/array-slice-1.1.0.tgz"
},
+ "array-union": {
+ "version": "2.1.0",
+ "from": "array-union@^2.1.0",
+ "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz"
+ },
"array-unique": {
"version": "0.3.2",
"from": "array-unique@>=0.3.2 <0.4.0",
@@ -289,6 +329,11 @@
"from": "color-name@1.1.3",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz"
},
+ "colorette": {
+ "version": "1.1.0",
+ "from": "colorette@^1.1.0",
+ "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.1.0.tgz"
+ },
"colors": {
"version": "1.1.2",
"from": "colors@>=1.1.2 <1.2.0",
@@ -416,6 +461,18 @@
"from": "diff@^4.0.1",
"resolved": "https://registry.npmjs.org/diff/-/diff-4.0.1.tgz"
},
+ "dir-glob": {
+ "version": "3.0.1",
+ "from": "dir-glob@^3.0.1",
+ "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz",
+ "dependencies": {
+ "path-type": {
+ "version": "4.0.0",
+ "from": "path-type@^4.0.0",
+ "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz"
+ }
+ }
+ },
"duplexer": {
"version": "0.1.1",
"from": "duplexer@>=0.1.1 <0.2.0",
@@ -562,11 +619,58 @@
"from": "fast-deep-equal@^2.0.1",
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-2.0.1.tgz"
},
+ "fast-glob": {
+ "version": "3.1.0",
+ "from": "fast-glob@^3.0.3",
+ "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.1.0.tgz",
+ "dependencies": {
+ "braces": {
+ "version": "3.0.2",
+ "from": "braces@^3.0.1",
+ "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz"
+ },
+ "fill-range": {
+ "version": "7.0.1",
+ "from": "fill-range@^7.0.1",
+ "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz"
+ },
+ "glob-parent": {
+ "version": "5.1.0",
+ "from": "glob-parent@^5.1.0",
+ "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.0.tgz"
+ },
+ "is-glob": {
+ "version": "4.0.1",
+ "from": "is-glob@^4.0.1",
+ "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.1.tgz"
+ },
+ "is-number": {
+ "version": "7.0.0",
+ "from": "is-number@>=7.0.0 <8.0.0",
+ "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz"
+ },
+ "micromatch": {
+ "version": "4.0.2",
+ "from": "micromatch@^4.0.2",
+ "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.2.tgz"
+ },
+ "to-regex-range": {
+ "version": "5.0.1",
+ "from": "to-regex-range@^5.0.1",
+ "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz"
+ }
+ }
+ },
"fast-json-stable-stringify": {
"version": "2.0.0",
"from": "fast-json-stable-stringify@>=2.0.0 <3.0.0",
"resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.0.0.tgz"
},
+ "fastq": {
+ "version": "1.6.0",
+ "from": "fastq@>=1.6.0 <2.0.0",
+ "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.6.0.tgz"
+ },
"fd-slicer": {
"version": "1.0.1",
"from": "fd-slicer@>=1.0.1 <1.1.0",
@@ -696,6 +800,18 @@
"from": "global-prefix@>=1.0.1 <2.0.0",
"resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-1.0.2.tgz"
},
+ "globby": {
+ "version": "10.0.1",
+ "from": "globby@10.0.1",
+ "resolved": "https://registry.npmjs.org/globby/-/globby-10.0.1.tgz",
+ "dependencies": {
+ "glob": {
+ "version": "7.1.6",
+ "from": "glob@^7.1.3",
+ "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.6.tgz"
+ }
+ }
+ },
"graceful-fs": {
"version": "4.2.3",
"from": "graceful-fs@^4.1.2",
@@ -891,6 +1007,11 @@
"from": "iconv-lite@~0.4.13",
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz"
},
+ "ignore": {
+ "version": "5.1.4",
+ "from": "ignore@^5.1.1",
+ "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.1.4.tgz"
+ },
"indent-string": {
"version": "2.1.0",
"from": "indent-string@>=2.1.0 <3.0.0",
@@ -1240,20 +1361,25 @@
"from": "merge-stream@^2.0.0",
"resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz"
},
+ "merge2": {
+ "version": "1.3.0",
+ "from": "merge2@^1.2.3",
+ "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.3.0.tgz"
+ },
"micromatch": {
"version": "3.1.10",
"from": "micromatch@^3.0.4",
"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.10.tgz"
},
"mime-db": {
- "version": "1.40.0",
- "from": "mime-db@1.40.0",
- "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.40.0.tgz"
+ "version": "1.42.0",
+ "from": "mime-db@1.42.0",
+ "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.42.0.tgz"
},
"mime-types": {
- "version": "2.1.24",
+ "version": "2.1.25",
"from": "mime-types@~2.1.19",
- "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.24.tgz"
+ "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.25.tgz"
},
"minimatch": {
"version": "3.0.4",
@@ -1481,6 +1607,11 @@
"from": "phantomjs-prebuilt@>=2.1.3 <3.0.0",
"resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.16.tgz"
},
+ "picomatch": {
+ "version": "2.1.1",
+ "from": "picomatch@^2.0.5",
+ "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.1.1.tgz"
+ },
"pify": {
"version": "2.3.0",
"from": "pify@>=2.0.0 <3.0.0",
@@ -1616,6 +1747,11 @@
"from": "ret@>=0.1.10 <0.2.0",
"resolved": "https://registry.npmjs.org/ret/-/ret-0.1.15.tgz"
},
+ "reusify": {
+ "version": "1.0.4",
+ "from": "reusify@>=1.0.0 <2.0.0",
+ "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz"
+ },
"rimraf": {
"version": "2.6.3",
"from": "rimraf@~2.6.2",
@@ -1633,6 +1769,33 @@
"from": "rollup@^0.66.0",
"resolved": "https://registry.npmjs.org/rollup/-/rollup-0.66.6.tgz"
},
+ "rollup-plugin-copy": {
+ "version": "3.1.0",
+ "from": "rollup-plugin-copy@^3.1.0",
+ "resolved": "https://registry.npmjs.org/rollup-plugin-copy/-/rollup-plugin-copy-3.1.0.tgz",
+ "dependencies": {
+ "fs-extra": {
+ "version": "8.1.0",
+ "from": "fs-extra@^8.1.0",
+ "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-8.1.0.tgz"
+ },
+ "is-plain-object": {
+ "version": "3.0.0",
+ "from": "is-plain-object@^3.0.0",
+ "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-3.0.0.tgz"
+ },
+ "isobject": {
+ "version": "4.0.0",
+ "from": "isobject@^4.0.0",
+ "resolved": "https://registry.npmjs.org/isobject/-/isobject-4.0.0.tgz"
+ },
+ "jsonfile": {
+ "version": "4.0.0",
+ "from": "jsonfile@>=4.0.0 <5.0.0",
+ "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz"
+ }
+ }
+ },
"rollup-plugin-node-resolve": {
"version": "3.4.0",
"from": "rollup-plugin-node-resolve@^3.4.0",
@@ -1653,6 +1816,11 @@
"from": "rollup-pluginutils@^2.6.0",
"resolved": "https://registry.npmjs.org/rollup-pluginutils/-/rollup-pluginutils-2.8.2.tgz"
},
+ "run-parallel": {
+ "version": "1.1.9",
+ "from": "run-parallel@>=1.1.9 <2.0.0",
+ "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.1.9.tgz"
+ },
"safe-buffer": {
"version": "5.1.2",
"from": "safe-buffer@~5.1.1",
@@ -1700,6 +1868,11 @@
"from": "signal-exit@>=3.0.0 <4.0.0",
"resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz"
},
+ "slash": {
+ "version": "3.0.0",
+ "from": "slash@^3.0.0",
+ "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz"
+ },
"snapdragon": {
"version": "0.8.2",
"from": "snapdragon@>=0.8.1 <0.9.0",
@@ -1967,9 +2140,9 @@
"resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz"
},
"typescript": {
- "version": "2.5.3",
- "from": "typescript@2.5.3",
- "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.5.3.tgz"
+ "version": "3.7.2",
+ "from": "typescript@3.7.2",
+ "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.7.2.tgz"
},
"uglify-js": {
"version": "3.4.10",
@@ -1998,6 +2171,11 @@
"from": "union-value@^1.0.0",
"resolved": "https://registry.npmjs.org/union-value/-/union-value-1.0.1.tgz"
},
+ "universalify": {
+ "version": "0.1.2",
+ "from": "universalify@>=0.1.0 <0.2.0",
+ "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz"
+ },
"unset-value": {
"version": "1.0.0",
"from": "unset-value@>=1.0.0 <2.0.0",
diff --git a/lib/docs/globals.html b/lib/docs/globals.html
index dfc0cd1..6fcd10e 100644
--- a/lib/docs/globals.html
+++ b/lib/docs/globals.html
@@ -2398,12 +2398,6 @@ img {
Smaller code as the internal properties and methods when defined within the instance can be minified.
As the resulting generated code can be better minified this should result in a smaller minified result and therefore better load times for your users.
-
- When to use
-
- While this helper was originally created to support better minification for generated code via TypeScript, it is not limited to only being used from within TypeScript.
- And as with including any additional code into your project there is a trade off that you need to make before using this helper which is the size of the additional code of this utility vs the minification gains that may be obtained. As in most cases of creating JavaScript code for better minfication if your code doesn't expose or provide a lot of public methods or only uses un-minifiable "names" less than 2 times then the potential gains may not be worth the additional bytes.
- And yes at the end of the day, if you are creating JS classes directly in Javascript you should be able to create a simplier one-off solution that would result in smaller output as this project needs to be generic to be able to support all use-cases.
Basic Usage
@@ -2459,13 +2453,70 @@ img {
Performance
- The minified version of this adds a negligible amount of code and loadtime to your source code and by using this library your generated code can be better minified as it removes most references of Classname.prototype.XXX methods from the generated code.
+ The minified version of this adds a negligible amount of code and loadtime to your source code and by using this library, your generated code can be better minified as it removes most references of Classname.prototype.XXX methods from the generated code.
Summary:
- ~2 KB minified (uncompressed)
+
+ Example usage and resulting minified code
+
+ In this first example of code that is typically emitted by TypeScript it contains several references to the Classname.prototype and "this" references, both of which cannot be minfied.
+ var NormalClass = (function () {
+ function NormalClass() {
+ this.property1 = [];
+ this.property1.push("Hello");
+ }
+ InheritTest1.prototype.function1 = function () {
+
+ doSomething();
+ };
+ InheritTest1.prototype.function2 = function () {
+
+ doSomething();
+ };
+ InheritTest1.prototype.function3 = function () {
+
+ doSomething();
+ };
+ return NormalClass;
+}());
+ So the result would look something like this which represents a ~45% compression, note that the Classname.prototype appears several times.
+ var NormalClass=(InheritTest1.prototype.function1=function(){doSomething()},InheritTest1.prototype.function2=function(){doSomething()},InheritTest1.prototype.function3=function(){doSomething()},function(){this.property1=[],this.property1.push("Hello")});
+ While in this example when using the dynamicProto helper to create the same resulting class and objects there are no references to Classname.prototype and only 1 reference to this.
+ var DynamicClass = (function () {
+ function DynamicClass() {
+ dynamicProto(DynamicClass, this, function (_self, base) {
+ _self.property1 = [];
+ _self.property1.push("Hello()");
+ _self.function1 = function () {
+
+ doSomething();
+ };
+ _self.function1 = function () {
+
+ doSomething();
+ };
+ _self.function1 = function () {
+
+ doSomething();
+ };
+ });
+ }
+ return DynamicClass;
+}());
+ Which results in the following minified code which is much smaller and represents ~63% compression.
+ var DynamicClass=function n(){dynamicProto(n,this,function(n,o){n.property1=[],n.property1.push("Hello()"),n.function1=function(){doSomething()},n.function1=function(){doSomething()},n.function1=function(){doSomething()}})};
+ So when looking at the code for NormalClass and DynamicClass, both end up with 1 instance property called property1 and the 3 functions function1, function2 and function3, in both cases the functions are defined ONLY on the "class" prototype and property1 is defined on the instance. So anyone, whether using JavaScript or TypeScript will be able to "extend" either of class without any concerns about overloading instance functions and needing to save any previous method. And you are extending a 3rd party library you no longer have to worry about them changing the implementation as dynamicProto() handles converting overriden instance functions into prototype level ones. Yes, this means that if you don't override instance function it will continue to be an instance function.
+
+ When to use
+
+ While this helper was created to support better minification for generated code via TypeScript code, it is not limited to only being used from within TypeScript, you can use the helper function directly in the same way as the examples above.
+ As with including any additional code into your project there are trade offs that you need to make, including if you are looking at this helper, one of the primary items is the overall size of the additional code that you will be including vs the minification gains that you may obtained. This project endeavours to keep it's impact (bytes) as small as possible while supporting you to create readable and maintainable code that will create a smaller minified output.
+ In most cases when creating JavaScript to support better minfication, when your code doesn't expose or provide a lot of public methods or only uses un-minifiable "names" less than 2 times, then you may not see enough potential gains to counteract the additional bytes required from the helper code. However, for any significant project you should.
+ So at the end of the day, if you are creating JS classes directly you should be able to create a simplier one-off solution that would result in smaller output (total bytes). This is how this project started, but, once we had several of these one-off solutions it made more sense to build it once.
Browser Support
@@ -2489,10 +2540,6 @@ img {
Latest ✔ |
-
- Contributing
-
- Read our contributing guide to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to Application Insights.
ES3/IE8 Compatibility
@@ -2577,6 +2624,10 @@ img {
N/A |
+
+ Contributing
+
+ Read our contributing guide to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to Application Insights.
Index
diff --git a/lib/docs/index.html b/lib/docs/index.html
index e569ef3..90d5560 100644
--- a/lib/docs/index.html
+++ b/lib/docs/index.html
@@ -2398,12 +2398,6 @@ img {
Smaller code as the internal properties and methods when defined within the instance can be minified.
As the resulting generated code can be better minified this should result in a smaller minified result and therefore better load times for your users.
-
- When to use
-
- While this helper was originally created to support better minification for generated code via TypeScript, it is not limited to only being used from within TypeScript.
- And as with including any additional code into your project there is a trade off that you need to make before using this helper which is the size of the additional code of this utility vs the minification gains that may be obtained. As in most cases of creating JavaScript code for better minfication if your code doesn't expose or provide a lot of public methods or only uses un-minifiable "names" less than 2 times then the potential gains may not be worth the additional bytes.
- And yes at the end of the day, if you are creating JS classes directly in Javascript you should be able to create a simplier one-off solution that would result in smaller output as this project needs to be generic to be able to support all use-cases.
Basic Usage
@@ -2459,13 +2453,70 @@ img {
Performance
- The minified version of this adds a negligible amount of code and loadtime to your source code and by using this library your generated code can be better minified as it removes most references of Classname.prototype.XXX methods from the generated code.
+ The minified version of this adds a negligible amount of code and loadtime to your source code and by using this library, your generated code can be better minified as it removes most references of Classname.prototype.XXX methods from the generated code.
Summary:
- ~2 KB minified (uncompressed)
+
+ Example usage and resulting minified code
+
+ In this first example of code that is typically emitted by TypeScript it contains several references to the Classname.prototype and "this" references, both of which cannot be minfied.
+ var NormalClass = (function () {
+ function NormalClass() {
+ this.property1 = [];
+ this.property1.push("Hello");
+ }
+ InheritTest1.prototype.function1 = function () {
+
+ doSomething();
+ };
+ InheritTest1.prototype.function2 = function () {
+
+ doSomething();
+ };
+ InheritTest1.prototype.function3 = function () {
+
+ doSomething();
+ };
+ return NormalClass;
+}());
+ So the result would look something like this which represents a ~45% compression, note that the Classname.prototype appears several times.
+ var NormalClass=(InheritTest1.prototype.function1=function(){doSomething()},InheritTest1.prototype.function2=function(){doSomething()},InheritTest1.prototype.function3=function(){doSomething()},function(){this.property1=[],this.property1.push("Hello")});
+ While in this example when using the dynamicProto helper to create the same resulting class and objects there are no references to Classname.prototype and only 1 reference to this.
+ var DynamicClass = (function () {
+ function DynamicClass() {
+ dynamicProto(DynamicClass, this, function (_self, base) {
+ _self.property1 = [];
+ _self.property1.push("Hello()");
+ _self.function1 = function () {
+
+ doSomething();
+ };
+ _self.function1 = function () {
+
+ doSomething();
+ };
+ _self.function1 = function () {
+
+ doSomething();
+ };
+ });
+ }
+ return DynamicClass;
+}());
+ Which results in the following minified code which is much smaller and represents ~63% compression.
+ var DynamicClass=function n(){dynamicProto(n,this,function(n,o){n.property1=[],n.property1.push("Hello()"),n.function1=function(){doSomething()},n.function1=function(){doSomething()},n.function1=function(){doSomething()}})};
+ So when looking at the code for NormalClass and DynamicClass, both end up with 1 instance property called property1 and the 3 functions function1, function2 and function3, in both cases the functions are defined ONLY on the "class" prototype and property1 is defined on the instance. So anyone, whether using JavaScript or TypeScript will be able to "extend" either of class without any concerns about overloading instance functions and needing to save any previous method. And you are extending a 3rd party library you no longer have to worry about them changing the implementation as dynamicProto() handles converting overriden instance functions into prototype level ones. Yes, this means that if you don't override instance function it will continue to be an instance function.
+
+ When to use
+
+ While this helper was created to support better minification for generated code via TypeScript code, it is not limited to only being used from within TypeScript, you can use the helper function directly in the same way as the examples above.
+ As with including any additional code into your project there are trade offs that you need to make, including if you are looking at this helper, one of the primary items is the overall size of the additional code that you will be including vs the minification gains that you may obtained. This project endeavours to keep it's impact (bytes) as small as possible while supporting you to create readable and maintainable code that will create a smaller minified output.
+ In most cases when creating JavaScript to support better minfication, when your code doesn't expose or provide a lot of public methods or only uses un-minifiable "names" less than 2 times, then you may not see enough potential gains to counteract the additional bytes required from the helper code. However, for any significant project you should.
+ So at the end of the day, if you are creating JS classes directly you should be able to create a simplier one-off solution that would result in smaller output (total bytes). This is how this project started, but, once we had several of these one-off solutions it made more sense to build it once.
Browser Support
@@ -2489,10 +2540,6 @@ img {
Latest ✔ |
-
- Contributing
-
- Read our contributing guide to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to Application Insights.
ES3/IE8 Compatibility
@@ -2577,6 +2624,10 @@ img {
N/A |
+
+ Contributing
+
+ Read our contributing guide to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to Application Insights.
diff --git a/lib/docs/modules/_dynamicproto_.html b/lib/docs/modules/_dynamicproto_.html
index 031fe74..bb481d4 100644
--- a/lib/docs/modules/_dynamicproto_.html
+++ b/lib/docs/modules/_dynamicproto_.html
@@ -2414,7 +2414,7 @@ img {
DynamicProtoDelegate<DPType>: function