About the loading of some third-party libraries

[stevenjoezhang]

I'm not sure if it's because of some historical reasons, but the loading of several third-party libraries is really confusing.

Issue 1: About mermaid and mathjax

Should we create new repo theme-next-mermaid or theme-next-mathjax? Should we move the cdn settings of mathjax to vendors section in _config.yml? Besides, many third-party libraries haven't been updated for a long time, e.g. the Internal version of jQuery remains 2.1.3

Issue 2: About the loading of pdf and mathjax

The per_page option is not complete of all possible situations. Is it possible to use a script to detect if there's any math formulae or pdf contens in the page, then load mathjax.js or pdfObject.js with ajax?
Besides, I would like to make pdf a new tag. The docs of #466 haven't been added yet.

Issue 3: _third_party?

In layout/_layout.swig:

hexo-theme-next/layout/_layout.swig

Lines 118 to 119 in 1a1bb45

	{% include '_third-party/scroll-cookie.swig' %}
	{% include '_third-party/exturl.swig' %}

In layout/_thire-party/scroll-cookie.swig:

hexo-theme-next/layout/_third-party/scroll-cookie.swig

Lines 1 to 4 in 1a1bb45

	{% if theme.save_scroll %}
	<script src="{{ url_for(theme.js) }}/src/js.cookie.js?v={{ version }}"></script>
	<script src="{{ url_for(theme.js) }}/src/scroll-cookie.js?v={{ version }}"></script>
	{% endif %}

In source/js/src/scroll-cookie.js:

hexo-theme-next/source/js/src/scroll-cookie.js

Lines 1 to 25 in 1a1bb45

	$(document).ready(function() {
	/* global Cookies */
	// Set relative link path (without domain)
	var rpath = window.location.href.replace(window.location.origin, '');
	// Write position in cookie
	var timeout;
	$(window).on('scroll', function() {
	clearTimeout(timeout);
	timeout = setTimeout(function() {
	Cookies.set('scroll-cookie', $(window).scrollTop() + '|' + rpath, { expires: 365, path: '' });
	}, 250);
	});
	// Read position from cookie
	if (Cookies.get('scroll-cookie') !== undefined) {
	var cvalues = Cookies.get('scroll-cookie').split('|');
	if (cvalues[1] === rpath) {
	$(window).scrollTop(cvalues[0]);
	}
	}
	});

So, why not just copy scroll-cookie.js to scroll-cookie.swig? This can reduce the times of http requests at the same time.

[maple3142]

I think it would be better to externalize all the optional libs, including their dependencies and code.

My proposal:
Create a third-party or plugins directory, and move some optional libs' implementation and dependencies to another repo.
When user want to use one, just clone (or git submodule) it into the folder and enable it through _config.yml.
The only thing remaining in the main repo is a include to the swig file in the plugin folder.

This would be a breaking change, but it can really improve types of commits to this repo.
Changes to plugin should be commited to their repo instead of this one.

[1v9]

• theme.vendors.mathjax is ok

• per_page is not good enough so I removed for quicklink, I think a uniform script can solve these problems.

• keep js like js, keep swig like swig?

[stevenjoezhang]

@maple3142 Agree, git-submodule is a good idea.
The _config.yml is over 1000 lines now... it's almost impossible for new users to understand what they should configure without reading all the docs.
@1v9 It can be implemented like this:
{% mermaid %} ... {% endmermaid %} -> <pre class="mermaid"></pre>

if ($("body").find(".mermaid")) {
     $.getScript("mermain.js", () => { ... });
}

[1v9]

Maybe checkout a new branch such as dev, do the huge job over there, if it's good enough then we can merge to master, also many docs need to update.

[jiangtj]

When user want to use one, just clone (or git submodule) it into the folder and enable it through _config.yml.

I think if possible, once cloning is enabled automatically. And they have their own configuration files that we can custom. Or overwrite it in the main configuration file.
But it seems unrealistic in hexo.

Can it be achieved through events?

[stevenjoezhang]

Related issues: #318, #413 and #564

[stevenjoezhang]

@ivan-nginx How do you think? Many theme-next-* repos are out of date. Need someone to maintain them, or we just change the way to manage these third-party packages.

[ivan-nginx]

@stevenjoezhang Oh, it's a little bit hard, I agree. But we need for provide end-user to choose what he want tu use: CDN or local files. Because in own server-use cases local files can joined into 1 request via HTTP2 protocol and site will load faster.

[ivan-nginx]

Ok, let's I show my vision on it.

Issue 1: About mermaid and mathjax

Should we create new repo theme-next-mermaid or theme-next-mathjax?

Yes, we should.

Should we move the cdn settings of mathjax to vendors section in _config.yml?

Yes, we should.

Besides, many third-party libraries haven't been updated for a long time, e.g. the Internal version of jQuery remains 2.1.3

I think in the distant future we can cutted out jQuery totally.

Issue 2: About the loading of pdf and mathjax

The per_page option is not complete of all possible situations. Is it possible to use a script to detect if there's any math formulae or pdf contens in the page, then load mathjax.js or pdfObject.js with ajax?
Besides, I would like to make pdf a new tag. The docs of #466 haven't been added yet.

I think u already get the solution for this.

Issue 3: _third_party?

So, why not just copy scroll-cookie.js to scroll-cookie.swig? This can reduce the times of http requests at the same time.

Yes, wiser will be to do that. In previous your PR I just talking about: no need to join Features & Bugfixes & Optimizations at once because if we will want to revert PR, PR will be reverted with all changes.. If it's Feature – create PR with Feature only; if Optimization – with Optimization. I know what sometimes when you modify code, you just modify other and other and other things, because you see something like bug and your hands want to «autofix» it. I reccomended to learn and use stash & pop in Git for that; it's something like backup current changes: when you didn't finish some feature and in same time find a bug, you can just stash current feature changes, when fix bug with further commit / PR and after that – pop your previous stash (feature changes).

---

Generally, I would be shocked if see auto-downloading function. For example, I set in config fancybox: true and during generate, NexT check fancybox lib in directory and if not found, donwload it (joined as module or submodule). No confusing, no docs reading for modules installation, no problems.

[stevenjoezhang]

Superseded by https://github.com/next-theme/plugins

GitHub

next-theme/plugins

Plugins for Hexo theme NexT. Contribute to next-theme/plugins development by creating an account on GitHub.