How to Optimize/Compress and Beautifly SVG Graphics FIles

When you are creating Vector Graphics using tools such as Inkscape and Adobe Illustrator then you can see that Size of created SVG file is quite big, and when you look at Source Code of SVG file, You can see that there is lot of unwanted metadata and attributes, which are not required. That is Why,

When You want to Optimize SVG file for your Website, you want small file size.

How to Optimize SVG Files

There is great Node.js module, which you can install and use to optimize big SVG files, So, let me show you, How you can install it.

First, Download and install Node.js, You can Download it from https://nodejs.org/en/download/, Just download latest stable version of it and install it in such a manner that you can use node.exe from windows Command Prompt.

After installing node.js, lets check if we can access node.exe from Windows Terminal or Command Prompt.

where node
@rem -- N:\NodeJSPortable\App\NodeJS\node.exe

where npm
@rem -- N:\NodeJSPortable\Data\npm.cmd

Now, Lets install svgo module or package for node.js. Open Windows PowerShell or Command Prompt, and use command given below.

npm install -g --verbose svgo
@rem -- npm info it worked if it ends with ok
@rem -- npm verb cli [ 'N:\\NodeJSPortable\\App\\NodeJS\\node.exe',
@rem -- npm verb cli   @rem -- 'N:\\NodeJSPortable\\Data\\node_modules\\npm\\bin\\npm-cli.js',
@rem -- npm verb cli   'install',
@rem -- npm verb cli   '-g',
@rem -- npm verb cli   '--verbose',
@rem -- npm verb cli   'svgo' ]
@rem -- npm info using npm@3.5.3
@rem -- npm info using node@v5.7.0

after installing svgo package for node.js, now we can use this package from command prompt. To know more about svgo you can check these websites.
https://github.com/svg/svgo
https://github.com/svg/svgo-gui
https://jakearchibald.github.io/svgomg/

NOTE: When you are working with SVG files which has UTF-8 encoded data/string, then you should use PowerShell instead of Standard Windows Command Prompt, because in some cases command prompt does not work as expected.

How to use svgo

Copy Full Path of your SVG file to Windows Clipboard and Open PowerShell.

@rem -- Case 1 (When You wanna Overwrite Existing SVG File`
svgo.cmd -i "input_svg_file_path.svg"

@rem -- Case 2 (Write Optimized version of SVG into Different File)
svgo.cmd -i "input_svg_file_path.svg" "output_svg_file_path.svg"

So, now you have a pretty long text string.

How to Beautifly SVG Files

You can not easiliy edit Optimized SVG files using test editor, because it is not readable, so we want to make it readable or prettty.

NOTE: When you are using git as version control system for your project and want to commit optimized SVG files to git, then you should Beautifly it before commiting to git.

There is a good plugin gsvg (Git-Friendly SVG), which we can use to Beautifly SVG files. so lets download and install it for node.js.
https://www.npmjs.com/package/gsvg

npm install -g --verbose gsvg
@rem -- npm info it worked if it ends with ok
@rem -- npm verb cli [ 'N:\\NodeJSPortable\\App\\NodeJS\\node.exe',
@rem -- npm verb cli   'N:\\NodeJSPortable\\Data\\node_modules\\npm\\bin\\npm-cli.js',
@rem -- npm verb cli   'install',
@rem -- npm verb cli   '-g',
@rem -- npm verb cli   '--verbose',
@rem -- npm verb cli   'gsvg' ]
@rem -- npm info using npm@3.5.3
@rem -- npm info using node@v5.7.0

How to use gsvg

Copy Full Path of your Optimized SVG file to Windows Clipboard.

gsvg.cmd "output_svg_file_path.svg" "pretty_svg_file_path.svg"

Must have Firewall Software for All Internet Users - GlassWire

Third-Party Firewall Software for Windows

---

So, You are looking for some Alternative for Windows Firewall, Because it is not that user Friendly, and you want something, which you can use without writing any line of code or command as well as you want to save your time, ok, you must take a look for GlassWire Software, don't worry, it is free with some cool features.

Why you should use it: GlassWire's firewall software reveals threats your antivirus missed, GlassWire is a free network monitor & security tool with a built in firewall.

GlassWire Features Overview

• Internet Security

GlassWire has built-in Firewall, which is very easy to use, you can block network traffic for any application, you can see realtime speed for any application. GlassWire has different types of Pre-Configured Alerts, which are super useful to visualize your Network.


• Built-in Firewall

GlassWire includes very simple Firewall Interface, So You can easiliy Allow/Block Network Traffic for any Application. You can also see real-time speed of Internet used by some running software. just click on fire icon, exists in very left side of app, you can block internet for that software, also you can easiliy turn ON/OFF Firewall.


• Visual Network Monitoring

GlassWire has very sweet Graphs with some unique themes for it, If you are using Classic Theme, You can visualize download speed with Yellow color and Upload speed with Pink color. With the help of Network Timeline you can see which apps had used, How much of Bandwidth (Downloaded+Uploaded) Data, and Data Usage for Given Protocol, and more, like hosts with which these apps had shared data.



• Network Time Machine

You can easily visualize Network Traffic used over a given timeline, that's why, they call it, Network Timeline, because as time-range changes, so does apps, traffic type data usage, alerts and list of accessed hosts.


• Discreet Alerts

When you are doing some serious work and you don't want to be disturbed by any Alert generated by GlassWire, You can active `Snooze On` Mode, it will disable notifications for 24 hours, unless you turn off `Snooze On` Mode



• Bandwidth Usage Monitor

For a given time-range, you can see Data/Bandwidth usage with list of apps, their individual usage, usage by traffic type and list of hosts/IPs those provide you that Data


• Remote Server Monitoring

You can also manage and visualize real-time network traffic and more, because using GlassWire you can easily access it from Remote Machine, because each GlassWire software acts as local server for GlassWire, all you need is IP Address of remote Computer which has it installed and running.


• Internet Privacy Protection

GlassWire has Incognito Mode, so that it won't record your network usage, but it will monitor real-time network traffic and network usage, but as soon as you turn off this Mode, it will delete that section from GlassWire History, and now you don't have to clear all history of GlassWire.


• Ask to connect Mode

`Pro` - Within GlassWire Firewall, this mode is useful, when you want to be notify for every new connection, and you want to manually allow network connction for that application.


• Lock down mode

`Pro` - You can block network traffic for all apps using this mode, all you need to do is, active this mode, using this button in GlassWire Firewall Tab.


• Mini graph

GlassWire can show you Mini Graph, so that you can put this Widget on to your Desktop Screen. it is really useful.


• Webcam/Mic detection

GlassWire can notify you when any software try to access you Webcam or Mic of your Laptop or Desktop.

• Who's on your WiFi or Network?

`Pro` - If you want to know, who are connected to your Wifi Router or Wifi Access Point, Because, sometimes you are so confused about data usage and want to monitor, who is using Internet using your Wifi Router.


• Multiple server monitoring

You can monitor and manage Remote GlassWire instance using your local GlassWire software, all you need to do is allow remote connections for your local GlassWire Server, configure some password and after that add remote GlassWire server details, like IP address. Now GlassWire software interface will change, and you can manage and visualize in real-time.


• New connection? Get notified

GlassWire can notify you when some new Software try to access Internet or network traffic, this is very useful, because sometimes nasty Virus try to connect to their creator and give them control of your own computer and this is not cool at all.

• What happened while you were away?

GlassWire can evaluate and generate simple report for you when it detect no user activity or your computer goes to sleep mode, for this you need to configure this Alert using GlassWire Settings.

Download Link: GlassWire

Short Animation

Video Editing with Free Blender Software