diff --git a/README.md b/README.md
index ffefafa..aa051e9 100644
--- a/README.md
+++ b/README.md
@@ -77,6 +77,7 @@ Server-side config.js settings
 | usessl | `true` or `false` | set to use ssl |
 | urladdport | `true` or `false` | set to add port on oauth callback url |
 | debug | `true` or `false` | set debug mode, show more logs |
+| usecdn | `true` or `false` | set to use CDN resources or not |
 | version | `0.3.2` | currnet version, must match same var in client side `index.js` |
 | alloworigin | `['localhost']` | domain name whitelist |
 | sslkeypath | `./cert/client.key` | ssl key path |
diff --git a/app.js b/app.js
index 628f463..a19715f 100644
--- a/app.js
+++ b/app.js
@@ -136,9 +136,7 @@ app.set('views', __dirname + '/public');
 //set render engine
 app.engine('html', ejs.renderFile);
 //get index
-app.get("/", function (req, res, next) {
-    res.render("index.html");
-});
+app.get("/", response.showIndex);
 //get status
 app.get("/status", function (req, res, next) {
     realtime.getStatus(function (data) {
diff --git a/config.js b/config.js
index cfd9f20..b04066d 100644
--- a/config.js
+++ b/config.js
@@ -11,6 +11,7 @@ var urladdport = true; //add port on getserverurl
 
 var config = {
     debug: true,
+	usecdn: false,
     version: '0.3.2',
     domain: domain,
     alloworigin: ['add here to allow origin to cross'],
diff --git a/lib/response.js b/lib/response.js
index b8cfab1..1f7fbd5 100644
--- a/lib/response.js
+++ b/lib/response.js
@@ -34,6 +34,7 @@ var response = {
     showFeatures: showFeatures,
     showNote: showNote,
     showPublishNote: showPublishNote,
+	showIndex: showIndex,
     noteActions: noteActions,
     publishNoteActions: publishNoteActions
 };
@@ -55,6 +56,18 @@ function responseError(res, code, detail, msg) {
     res.end();
 }
 
+function showIndex(req, res, next) {
+    res.writeHead(200, {
+        'Content-Type': 'text/html'
+    });
+    var template = config.indexpath;
+    var content = ejs.render(fs.readFileSync(template, 'utf8'), {
+        useCDN: config.usecdn
+    });
+    res.write(content);
+    res.end();
+}
+
 function responseHackMD(res, noteId) {
     if (noteId != config.featuresnotename) {
         if (!Note.checkNoteIdValid(noteId)) {
diff --git a/public/index.html b/public/index.ejs
similarity index 87%
rename from public/index.html
rename to public/index.ejs
index 829c044..dbc5e26 100644
--- a/public/index.html
+++ b/public/index.ejs
@@ -15,13 +15,19 @@
     <link rel="apple-touch-icon" href="/apple-touch-icon.png">
 
     <!-- Bootstrap core CSS -->
-    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
+    <% if(useCDN) { %>
+    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
     <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
+	<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-social/4.9.0/bootstrap-social.min.css">
+	<% } else { %>
+	<link rel="stylesheet" href="/vendor/bootstrap/css/bootstrap.min.css">
+	<link rel="stylesheet" href="/vendor/font-awesome/css/font-awesome.min.css">
+	<link rel="stylesheet" href="/css/bootstrap-social.css">
+	<% } %>
     <link rel="stylesheet" href="/vendor/select2/select2.css">
     <link rel="stylesheet" href="/vendor/select2/select2-bootstrap.css">
     <!-- Custom styles for this template -->
     <link rel="stylesheet" href="/css/cover.css">
-    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-social/4.9.0/bootstrap-social.min.css">
     <link rel="stylesheet" href="/css/site.css">
 </head>
 
@@ -203,21 +209,32 @@
     <!-- Bootstrap core JavaScript
     ================================================== -->
     <!-- Placed at the end of the document so the pages load faster -->
-    <script src="//code.jquery.com/jquery-1.11.3.min.js" defer></script>
-    <script src="//cdnjs.cloudflare.com/ajax/libs/gsap/1.16.1/TweenMax.min.js" defer></script>
+    <% if(useCDN) { %>
+	<script src="//code.jquery.com/jquery-1.11.2.min.js" defer></script>
+	<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js" defer></script>
+	<script src="//cdnjs.cloudflare.com/ajax/libs/gsap/1.16.1/TweenMax.min.js" defer></script>
     <script src="//cdnjs.cloudflare.com/ajax/libs/gsap/1.16.1/jquery.gsap.min.js" defer></script>
-    <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js" defer></script>
-    <script src="//cdnjs.cloudflare.com/ajax/libs/select2/3.5.2/select2.min.js" defer></script>
+	<script src="//cdnjs.cloudflare.com/ajax/libs/select2/3.5.2/select2.min.js" defer></script>
+	<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.min.js" defer></script>
+	<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/3.0.0/handlebars.min.js" defer></script>
+	<script src="//cdnjs.cloudflare.com/ajax/libs/js-url/1.8.6/url.min.js" defer></script>
+	<% } else { %>
+	<script src="/vendor/jquery-1.11.2.min.js" defer></script>
+	<script src="/vendor/bootstrap/js/bootstrap.min.js" defer></script>
+    <script src="/vendor/greensock-js/TweenMax.min.js" defer></script>
+    <script src="/vendor/greensock-js/jquery.gsap.min.js" defer></script>
+	<script src="/vendor/select2/select2.min.js" defer></script>
+	<script src="/vendor/moment-with-locales.js" defer></script>
+    <script src="/vendor/handlebars-v3.0.0.js" defer></script>
+	<script src="/vendor/url.min.js" defer></script>
+	<% } %>
     <script src="/vendor/js.cookie.js" defer></script>
-    <script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.min.js" defer></script>
-    <script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/3.0.0/handlebars.min.js" defer></script>
     <script src="/vendor/list.min.js" defer></script>
     <script src="/vendor/FileSaver.min.js" defer></script>
     <script src="/vendor/store.min.js" defer></script>
-    <script src="//cdnjs.cloudflare.com/ajax/libs/js-url/1.8.6/url.min.js" defer></script>
     <script src="/js/common.js" defer></script>
     <script src="/js/history.js" defer></script>
     <script src="/js/cover.js" defer></script>
 </body>
 
-</html>
+</html>
\ No newline at end of file
diff --git a/public/views/foot.ejs b/public/views/foot.ejs
index b545841..0f56864 100644
--- a/public/views/foot.ejs
+++ b/public/views/foot.ejs
@@ -1,9 +1,18 @@
+<% if(useCDN) { %>
+<script src="//cdnjs.cloudflare.com/ajax/libs/spin.js/2.3.2/spin.min.js" defer></script>
+<script src="//code.jquery.com/jquery-1.11.2.min.js" defer></script>
+<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.1.13/jquery.mousewheel.min.js" defer></script>
+<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js" defer></script>
+<script src="//cdnjs.cloudflare.com/ajax/libs/gsap/1.16.1/TweenMax.min.js" defer></script>
+<script src="//cdnjs.cloudflare.com/ajax/libs/gsap/1.16.1/jquery.gsap.min.js" defer></script>
+<% } else { %>
 <script src="/vendor/spin.min.js" defer></script>
 <script src="/vendor/jquery-1.11.2.min.js" defer></script>
 <script src="/vendor/jquery.mousewheel.min.js" defer></script>
 <script src="/vendor/bootstrap/js/bootstrap.min.js" defer></script>
 <script src="/vendor/greensock-js/TweenMax.min.js" defer></script>
 <script src="/vendor/greensock-js/jquery.gsap.min.js" defer></script>
+<% } %>
 <!--codemirror-->
 <script src="/vendor/codemirror/codemirror.min.js" defer></script>
 <script src="/vendor/inlineAttachment/inline-attachment.js" defer></script>
diff --git a/public/views/head.ejs b/public/views/head.ejs
index 0518ebc..816c2a2 100644
--- a/public/views/head.ejs
+++ b/public/views/head.ejs
@@ -7,8 +7,15 @@
 <title><%- title %></title>
 <link rel="icon" type="image/png" href="/favicon.png">
 <link rel="apple-touch-icon" href="/apple-touch-icon.png">
+<% if(useCDN) { %>
+<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
+<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
+<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-social/4.9.0/bootstrap-social.min.css">
+<% } else { %>
 <link rel="stylesheet" href="/vendor/bootstrap/css/bootstrap.min.css">
 <link rel="stylesheet" href="/vendor/font-awesome/css/font-awesome.min.css">
+<link rel="stylesheet" href="/css/bootstrap-social.css">
+<% } %>
 <link rel="stylesheet" href="/vendor/codemirror/lib/codemirror.css">
 <link rel="stylesheet" href="/vendor/codemirror/addon/fold/foldgutter.css">
 <link rel="stylesheet" href="/vendor/codemirror/addon/dialog/dialog.css">
@@ -20,7 +27,6 @@
 <link rel="stylesheet" href="/vendor/highlight-js/github-gist.min.css">
 <link rel="stylesheet" href="/vendor/emojify/css/emojify.min.css">
 <link rel="stylesheet" href="/vendor/showup/showup.css">
-<link rel="stylesheet" href="/css/bootstrap-social.css">
 <link rel="stylesheet" href="/css/markdown.css">
 <link rel="stylesheet" href="/css/index.css">
 <link rel="stylesheet" href="/css/extra.css">
diff --git a/public/views/pretty.ejs b/public/views/pretty.ejs
index cc4f80d..0004bb7 100644
--- a/public/views/pretty.ejs
+++ b/public/views/pretty.ejs
@@ -10,9 +10,14 @@
     <meta name="mobile-web-app-capable" content="yes">
     <title><%- title %></title>
     <link rel="icon" type="image/png" href="<%- url %>/favicon.png">
-<link rel="apple-touch-icon" href="<%- url %>/apple-touch-icon.png">
-    <link rel="stylesheet" href='<%- url %>/vendor/bootstrap/css/bootstrap.min.css'>
+	<link rel="apple-touch-icon" href="<%- url %>/apple-touch-icon.png">
+	<% if(useCDN) { %>
+	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
+	<% } else { %>
+	<link rel="stylesheet" href='<%- url %>/vendor/bootstrap/css/bootstrap.min.css'>
     <link rel="stylesheet" href='<%- url %>/vendor/font-awesome/css/font-awesome.min.css'>
+	<% } %>
     <link rel="stylesheet" href='<%- url %>/css/github-extract.css'>
     <link rel="stylesheet" href='<%- url %>/css/gist.css'>
     <link rel="stylesheet" href='<%- url %>/vendor/highlight-js/github-gist.min.css'>
@@ -45,8 +50,13 @@
 </body>
 
 </html>
+<% if(useCDN) { %>
+<script src="https://code.jquery.com/jquery-1.11.2.min.js" defer></script>
+<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js" defer></script>
+<% } else { %>
 <script src="<%- url %>/vendor/jquery-1.11.2.min.js" defer></script>
 <script src="<%- url %>/vendor/bootstrap/js/bootstrap.min.js" defer></script>
+<% } %>
 <script src="<%- url %>/vendor/lz-string.min.js" defer></script>
 <script src="<%- url %>/vendor/remarkable.min.js" defer></script>
 <script src="<%- url %>/vendor/remarkable-regex.js" defer></script>