This repository has been archived by the owner on Aug 5, 2021. It is now read-only.
Refactor icon generator (i.e. VueSimpleIcon component) #20
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Update the `renderError` function to accept a custom title so that it can be used for other errors then just "Icon not found".
Utilizing the `domProps` property for VNodes to set the content of the SVG straight from the source through the DOM property `innerHTML`. Based on this comment: https://stackoverflow.com/a/51276128/4132379 More info about this approach in the VueJS documentation: https://vuejs.org/v2/guide/render-function.html#The-Data-Object-In-Depth
Codecov Report
@@ Coverage Diff @@
## master #20 +/- ##
=====================================
Coverage 100% 100%
=====================================
Files 1 1
Lines 50 41 -9
Branches 16 11 -5
=====================================
- Hits 50 41 -9
Continue to review full report at Codecov.
|
dsseng
reviewed
Dec 24, 2018
|
@ericcornelissen Thanks for these improvements! |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
The primary change is reducing the code complexity of and improving the performance when generating icons utilizing the
domPropsproperty to inject the SVG as it is provided by SimpleIcons. The<svg>itself is still created as a VNode in order to keep the size changes easy, but the contents of the SVG come straight fromicon.svg.The second change is the introduction of the
titleargument to therenderError()function, which makes it easier to render errors with a custom message/title.Other changes:
htocreateElementfor clarity.xin the name property validator tonamefor clarity.this.parserfrom the VueSimpleIcon class, it is no longer needed as per the primary change."#" + this.color-->#${this.color}).Possible improvements:
</svg>using a fixed method (e.g.String.substr) rather then a Regular Expression for performance. However, it is rather convenient to have the Regular Expression remove both the opening and closing SVG tag.<title>...</title>from theicon.svgstring which would probably still require a Regular Expression.Why is this change required?
Should improve code readability and performance, not critical though.