You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

README.md 2.0KB

5 months ago
12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. # Code minification & compression in webflow
  2. While Webflow offers a visual interface for building websites, minifying and compressing your code can offer several benefits like faster loading times and improved SEO. Here's how you can achieve this with short and clean code examples:
  3. **1. Using Webflow's Built-in Features:**
  4. Custom Code: In the Custom Code section, Webflow automatically minifies your JavaScript and CSS when saving. This is a simple and effective way to get started.
  5. **Example:**
  6. ```
  7. HTML
  8. <script>
  9. function myFunction() {
  10. // Your code here
  11. }
  12. </script>
  13. <style>
  14. body {
  15. color: #333;
  16. }
  17. </style>
  18. ```
  19. - **Global Site Settings:** Under the "Settings" tab, you can enable "Minify custom code" and "Compress HTML" options. This applies compression across your entire website.
  20. **2. Advanced Code Minification Options:**
  21. - **External Tools:** Use online tools like UglifyJS or CSSNano tominify your JavaScript and CSS code manually. You can then paste the minified code into Webflow's Custom Code section.
  22. **Example:**
  23. ```
  24. JavaScript
  25. // Minified code generated by UglifyJS
  26. (function(){var e={},t=/[a-zA-Z0-9_$]/;function r(n){if(e[n])return e[n];var i=n.length;if(i>60){var a={},o=0;for(;o<i;)a[n.charAt(o++)]=!0}else{a=[];for(o=0;o<i;)a[n.charCodeAt(o++)]=!0}return e[n]=a}function n(e){var t="";for(var r=0;r<e.length;r++){var n=e.charCodeAt(r);if(32<=n&&n<=126)t+=e.charAt(r);else{if(n>255)return"";t+=r?"%"+n.toString(16).toUpperCase():"%"+"0"+n.toString(16).toUpperCase()}}return t}function i(e){var t=r(e);if(!t)return e;var n="",i=0;for(var a=0;a<e.length;a++){var o=e.charCodeAt(a);if(t[o]){if(n)n+=i;i=0}else{if(1!=i)n+=" "+n(e.substr(a,i));i=1}}if(n)n+=i;return n}e.minify=function(e){return i(e)};})();
  27. ```
  28. - **Webflow Integrations:** Integrate third-party tools like Parcel or Webpack in your build process to automate minification, compression, and other optimization tasks.
  29. # Need Help?
  30. Need a High Converting [SaaS Landing Page](https://epyc.in/)?