{"id":17821869,"url":"https://github.com/pavlelekic/update-if-props-change","last_synced_at":"2026-05-08T19:33:33.009Z","repository":{"id":57387114,"uuid":"81105755","full_name":"pavlelekic/update-if-props-change","owner":"pavlelekic","description":"A handy React.js component to prevent re-rendering of sections of larger components that do not need to be re-rendered.","archived":false,"fork":false,"pushed_at":"2017-02-07T14:47:54.000Z","size":9,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-10-08T09:52:56.800Z","etag":null,"topics":["javascript","react","react-native","reactjs"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/pavlelekic.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-02-06T16:14:03.000Z","updated_at":"2017-03-08T09:16:02.000Z","dependencies_parsed_at":"2022-08-31T04:31:12.397Z","dependency_job_id":null,"html_url":"https://github.com/pavlelekic/update-if-props-change","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/pavlelekic/update-if-props-change","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pavlelekic%2Fupdate-if-props-change","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pavlelekic%2Fupdate-if-props-change/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pavlelekic%2Fupdate-if-props-change/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pavlelekic%2Fupdate-if-props-change/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pavlelekic","download_url":"https://codeload.github.com/pavlelekic/update-if-props-change/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pavlelekic%2Fupdate-if-props-change/sbom","scorecard":{"id":724075,"data":{"date":"2025-08-11","repo":{"name":"github.com/pavlelekic/update-if-props-change","commit":"cec2a454031d7f929273c7916c3c470156a49a75"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":3,"checks":[{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"SAST","score":0,"reason":"no SAST tool detected","details":["Warn: no pull requests merged into dev branch"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"Code-Review","score":0,"reason":"Found 0/9 approved changesets -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"Vulnerabilities","score":10,"reason":"0 existing vulnerabilities detected","details":null,"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Info: FSF or OSI recognized license: MIT License: LICENSE:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}}]},"last_synced_at":"2025-08-22T12:14:09.841Z","repository_id":57387114,"created_at":"2025-08-22T12:14:09.841Z","updated_at":"2025-08-22T12:14:09.841Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32794716,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-08T08:22:46.396Z","status":"ssl_error","status_checked_at":"2026-05-08T08:22:45.650Z","response_time":54,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["javascript","react","react-native","reactjs"],"created_at":"2024-10-27T17:26:42.499Z","updated_at":"2026-05-08T19:33:32.985Z","avatar_url":"https://github.com/pavlelekic.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"## Do you absolutely need this?\n\nYou don’t. You can achieve the same functionality with a lot more typing. What this component does is it prevents rerendering of it’s child components unless some of the variables that they depend on change.\n\nSo you could extract those child components into a separate component, implement a `shouldComponentUpdate()` method and you would have the same functionality. With much more typing.\n\n## Instalation\n\nVia npm:\n\n`npm install update-if-props-change --save`\n\n## How to use it\nThis component is especially useful if you have a big component with few sections that depend on different props/state variables. \n\nSince all those sections belong to the same component, they will be rerendered whenever any of the props/state variables change. You don’t want that. You want the section of a big component to be re rendered only when variables that that section depends on change.\n\nYou can setup this ‘conditional’ re-rendering easy inline with `\u003cUpdateIfPropsChange /\u003e` component. Here is an example:\n```javascript\n\nrender() {\n  return (\n    \u003cComponentA\u003e\n      \u003cUpdateIfPropsChange props={[this.props.someVar1, this.state.someVar2]}\u003e\n        \u003cComponentB\u003e\n          \u003cText\u003e{this.props.someVar1 + this.state.someVar2}\u003c/Text\u003e\n        \u003c/ComponentB\u003e\n      \u003c/UpdateIfPropsChange\u003e\n      \u003cUpdateIfPropsChange props={[this.props.someVar3]}\u003e\n        \u003cComponentE\u003e\n          \u003cText\u003e{this.props.someVar3}\u003c/Text\u003e\n        \u003c/ComponentE\u003e\n      \u003c/UpdateIfPropsChange\u003e\n    \u003c/ComponentA\u003e\n  );\n}\n```\n\n### Props\n\n`props` - Array of variables that you want to watch for changes. They can be state variables, props, whatever. Whenever any of those variables change, the child components of `\u003cUpdateIfPropsChange/\u003e` will be rerendered.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpavlelekic%2Fupdate-if-props-change","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpavlelekic%2Fupdate-if-props-change","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpavlelekic%2Fupdate-if-props-change/lists"}