{"_id":"@avensia-oss/ts-transform-instrument-react-components","_rev":"6-754625a202292fdd85ec42a13c1cf690","name":"@avensia-oss/ts-transform-instrument-react-components","dist-tags":{"latest":"0.0.2"},"versions":{"0.0.1":{"name":"@avensia-oss/ts-transform-instrument-react-components","version":"0.0.1","keywords":["TypeScript","transform","transformer","react","instrument"],"author":{"name":"Anders Ekdahl","email":"anders.ekdahl@avensia.com"},"license":"MIT","_id":"@avensia-oss/ts-transform-instrument-react-components@0.0.1","maintainers":[{"name":"avensia-oss","email":"andekd@avensia.com"}],"homepage":"https://github.com/avensia-oss/ts-transform-instrument-react-components","bugs":{"url":"https://github.com/avensia-oss/ts-transform-instrument-react-components"},"dist":{"shasum":"38ec961c673a0674d5059884716f2e1e8923605e","tarball":"https://registry.npmjs.org/@avensia-oss/ts-transform-instrument-react-components/-/ts-transform-instrument-react-components-0.0.1.tgz","fileCount":9,"integrity":"sha512-QLGHI7y6BCU0sytvq7nF32WC2N13QWYOC7jGQlAqRwuUgWUaIM7yrLrtX2Zci0i3pN8BEjrLqfYc3rj4anft2w==","signatures":[{"sig":"MEQCIDfxsTMVH+73dmhTxSna63cvOCuc7r2Z1u81JV0FlPXgAiBEDW7T2DKrQt0SuualvplfuJ/VQ0zWYHkZg8VPpISuxQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":15579,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcLMttCRA9TVsSAnZWagAAiBAP/0iuXiAwi/XqV6oqGbzX\nDi8uKN1erxc6LJLoqcLXbJ2UXvZ/P0YTd0Yvcxek9B6DjR2cg1DPV+/KXCTz\n8G0aGybsfXyb9O7A4Fi0Ugp3eICqSdcJ8Yc7SuBJvH9vUMrE1vuHf1dYlIsm\nx13BnL/UMJwGYNcv3nkS8jnF9i+yeGs8PsZyzpwrJ0J+sN5DTjNBbyVzkwrn\n3BsN2HdNyydX6NEUpdWwgzeDTRInM4l8XHBOnnxP2UNKimetayL3ZnrLfraa\nE80/GWlmg+Q195i0+ZazjR0mENI0QMgEGZ0KyO91TUVp507q4akyH+T6RdIT\n9REDIKaRe2ztjZPYMuTrs/qBtaPkeNUyKce59RzxpL95w7+Qt8KSwxtHtamS\n12OIzFEZ57muOIJzgPqpMPxMBZZGTu1E0V4v9S59OJgGqdXUz0yrIlnpOtCR\nuiudZF7XO2D47q0QBk5dJZLcDZ0Uxc20thjaIpzXebKi+4KAFRDB8HVK45Iu\ni2zOibx4RSySUJH5SDVmDexTeR536AplsVB492VtE9biH7WJkSSivDNF2J/8\nTJ8P/S0uA8fepFRaSwGKCDF26Hdbz/iQmuDLiTA9YbzwOcX/K/HnFl6akigw\ndujSdXeWPxZAG1qCJf3WdZB39gNbFI/VMV4ETZYXPReXmAZGGDDVRcgHtwER\nsPvp\r\n=I9o1\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","private":false,"scripts":{"test":"jest","build":"tsc --version && tsc --project \"./\""},"_npmUser":{"name":"avensia-oss","email":"andekd@avensia.com"},"description":"A TypeScript custom transformer that instruments React components to be able to detect which components aren't rendered","directories":{},"licenseText":"MIT License\n\nCopyright (c) Avensia AB and its affiliates.\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.","dependencies":{"@types/react":"^16.7.18"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^23.6.0","ts-jest":"^23.10.5","prettier":"^1.15.3","typescript":"^3.2.2","@types/jest":"^23.3.10","@types/node":"^10.12.18"},"peerDependencies":{"typescript":"*"},"_npmOperationalInternal":{"tmp":"tmp/ts-transform-instrument-react-components_0.0.1_1546439532971_0.7634178044719677","host":"s3://npm-registry-packages"}},"0.0.2":{"name":"@avensia-oss/ts-transform-instrument-react-components","version":"0.0.2","keywords":["TypeScript","transform","transformer","react","instrument"],"author":{"name":"Anders Ekdahl","email":"anders.ekdahl@avensia.com"},"license":"MIT","_id":"@avensia-oss/ts-transform-instrument-react-components@0.0.2","maintainers":[{"name":"avensia-oss","email":"andekd@avensia.com"}],"homepage":"https://github.com/avensia-oss/ts-transform-instrument-react-components","bugs":{"url":"https://github.com/avensia-oss/ts-transform-instrument-react-components"},"dist":{"shasum":"55a2e03b12d4a167015b6fb34477dec18f0bccbb","tarball":"https://registry.npmjs.org/@avensia-oss/ts-transform-instrument-react-components/-/ts-transform-instrument-react-components-0.0.2.tgz","fileCount":10,"integrity":"sha512-WkCOG/hs2OqwiY5dk2oH49+HjUUgJ7O2Ch+r9jU+eqtOj2KP4FgP3x00YMorFDGfOa4dC0Ecp36Rsfqrs8fenA==","signatures":[{"sig":"MEQCIH46G7zi61J9YqG1hcMbRE5neUK5WQtIygn9eX/Oy9BUAiBKOV5DAtD13FFjTs5cmL2e6dJ70HM61Jb7uc5I6/0vTQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":15572,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJct0MeCRA9TVsSAnZWagAAq3EP/25EBtjzkXXzzTl3dOZE\nHMXN7U4TnM2DIfXAfFXsDMZpcwswqb6jUasGGnReMBEejMk5kBdrQmShe9tk\n9uyPtQB7lNDulKolCGeEyMcU8uh2NhIoNg90xBEl/gsgREuiwlOUOOouFkM2\nDqMNiSauIvIJLeIdywEgAIdExMycafxNuHV7j0cP29Y3voM8pl876GQ6vgMZ\nRYWo/pTX7ULVISBkWYt9eLzQz86SjKGS4dzfKoINft/J532nPI+kNWSe2mzD\nkRrDwQ6EBM7sy0yhRkPTvwfnPQhtmyBOnSs4G/RVpAkePiQbcW1xhlmq7qHD\nOCzcOkXlQNjs9LYUa2C33WeFtfmJKEYgPcYpijJwddD4TCMZGbe5d0Zz0STl\nNFA0EQ9Sy9UuQkp9bnXslvpDLMUJKtc1VrDC/awpBdJKUww3xU7Sw69tAr+1\nFLXA6Wy3JzA7SRCVk3YCKmbVlQx454wMBoswqlhMOLuy0AFBaX/P4APpUiz/\nqjA+ia6Ye5NM/P0oXPxDytagD+b6BWAApCKma43fuOY92+8TZHwut7VUbVXo\nlqbc2q1ObSaz5V3a+XkAdJXsnb1dWPcwB3xuvRmMBqAA71ziXQyUxM/zxEJw\njDl0keRus2YXuxWQ6EWpOujHt6uQMn+2+1oFkDUy5ojEv3i1VrGVauLtQdiT\nhPEW\r\n=Q3U4\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","types":"dist/src/index.d.ts","private":false,"scripts":{"test":"jest","build":"tsc --version && tsc --project \"./\""},"_npmUser":{"name":"avensia-oss","email":"andekd@avensia.com"},"description":"A TypeScript custom transformer that instruments React components to be able to detect which components aren't rendered","directories":{},"licenseText":"MIT License\n\nCopyright (c) Avensia AB and its affiliates.\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.","dependencies":{"@types/react":"^16.7.18"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^23.6.0","ts-jest":"^23.10.5","prettier":"^1.15.3","typescript":"^3.2.2","@types/jest":"^23.3.10","@types/node":"^10.12.18"},"peerDependencies":{"typescript":"*"},"_npmOperationalInternal":{"tmp":"tmp/ts-transform-instrument-react-components_0.0.2_1555514141384_0.6399821139693886","host":"s3://npm-registry-packages"}}},"time":{"created":"2019-01-02T14:32:12.813Z","modified":"2026-09-21T11:35:06.045Z","0.0.1":"2019-01-02T14:32:13.098Z","0.0.2":"2019-04-17T15:15:41.531Z"},"bugs":{"url":"https://github.com/avensia-oss/ts-transform-instrument-react-components"},"author":{"name":"Anders Ekdahl","email":"anders.ekdahl@avensia.com"},"license":"MIT","homepage":"https://github.com/avensia-oss/ts-transform-instrument-react-components","keywords":["TypeScript","transform","transformer","react","instrument"],"description":"A TypeScript custom transformer that instruments React components to be able to detect which components aren't rendered","maintainers":[{"email":"eric.lindell@avensia.com","name":"lindelleric"},{"email":"johan.book@avensia.com","name":"johboo"},{"email":"johan.nilsson@avensia.com","name":"yoohahn-avensia"}],"readme":"# ts-transform-instrument-react-components\n\n_Note! This transformer is currently experimental_\n\nA TypeScript custom transformer that instruments React components to report which components exists in your bundle and which gets rendered. This information can then be used to optimize your bundle and load unrendered components lazily.\n\n## How to extract the information\n\nThis transformer modifies all files that contains components to define a global variable called `reactInstrumentationDefinedComponents`. This is an object with file\nnames as key and array of exported names as value. It might look like this:\n\n```\nglobal.reactInstrumentationDefinedComponents = {\n  'Component1.tsx': ['default', 'SomeOtherComponent']\n}\n```\n\nAnother variable of the same type is created which is called `reactInstrumentationRenderedComponents`. That will contain a list of the same type of objects of c\nomponents that have been rendered. So if only the default export from the previous example was rendered it would look like this:\n\n```\nglobal.reactInstrumentationRenderedComponents = {\n  'Component1.tsx': ['default']\n}\n```\n\nIn order to know which components your file includes that doesn't get rendered you'd run this transform on your code, load the code in Node.js and call\n`ReactDOM.renderToString()` on your main components and then check the diff of `reactInstrumentationDefinedComponents` and `reactInstrumentationRenderedComponents`.\nYou can of course also run the transformed code in the browser as well and view those global objects in the dev tools.\n\n## Other useful transform\n\nIf you find this transform useful you might want to use these ones as well: https://github.com/avensia-oss/ts-transform-export-const-folding and https://github.com/avensia-oss/ts-transform-async-import\n\n# Installation\n\n```\nyarn add @avensia-oss/ts-transform-instrument-react-components\n```\n\n## Usage with webpack\n\nUnfortunately TypeScript doesn't let you specifiy custom transformers in `tsconfig.json`. If you're using `ts-loader` with webpack you can specify it like this:\nhttps://github.com/TypeStrong/ts-loader#getcustomtransformers-----before-transformerfactory-after-transformerfactory--\n\nThe default export of this module is a function which expects a `ts.Program` an returns a transformer function. Your config should look something like this:\n\n```\nconst instrumentReactComponentsTransform = require('@avensia-oss/ts-transform-instrument-react-components');\n\nreturn {\n  ...\n  options: {\n    getCustomTransformers: (program) => ({\n      before: [instrumentReactComponentsTransform(program)]\n    })\n  }\n  ...\n};\n```\n","readmeFilename":"README.md"}