Skip to content

Bust the assets cache on modification. - #309

Merged
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache
Aug 10, 2018
Merged

Bust the assets cache on modification.#309
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Jul 31, 2018

Copy link
Copy Markdown
Contributor

Append time modified as query string to assets urls to trick the cache to refresh the file.

cc @plotly/dash

Resolves#303

@rmarren1

Copy link
Copy Markdown
Contributor

I like this, annoying to always have dev tools open and the cache probably trips up beginners.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While this will work when developing locally, assets will still be cached by the browser when the user deploys the app. The use case I'm imagining is:

  1. Developer deploys their app
  2. Person A visits their app
  3. Developer changes CSS, deploys again
  4. Person A visits again - the CSS is cached from when they visited the app before the previous deploy.

The developer won't see an issue because they got the new version when they were developing, so they might not even know that their visitors will have an issue.

So, I think we should append a time modified query string or some other solution

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 090e0fd to 35a4bb0CompareJuly 31, 2018 21:55
@T4rk1nT4rk1n changed the title Disable the cache if debug=True.Bust the assets cache on modification.Jul 31, 2018
@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp I changed this PR to use time modified query string.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome, thanks for updating this! Once this is released, could you update https://github.com/plotly/dash-docs/blob/master/tutorial/external_css_and_js.py#L160-L163?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp Ok, I'll release this along with #305 tomorrow.

@chriddyp

Copy link
Copy Markdown
Member

@T4rk1n - Could we get this one merged and released?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp
Sorry I thought @bpostlethwaite wanted to chime in, we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings.

@chriddyp

Copy link
Copy Markdown
Member

we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings

OK. Why? It seems to complicate things to have two different ways that caches are invalidated in local vs deployed. Also, we don't have the config abstraction around local vs production yet.

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

That is also my feeling, I'll merge & release.

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 35a4bb0 to 67f8601CompareAugust 10, 2018 20:25
@T4rk1n
T4rk1n merged commit 7d847c6 into masterAug 10, 2018
@T4rk1n
T4rk1n deleted the dev-mode-disable-cache branch August 10, 2018 21:04
HammadTheOne pushed a commit to HammadTheOne/dash that referenced this pull request May 28, 2021
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@T4rk1n@rmarren1@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { // Add copy buttons to all
 blocks
(function() {
function addCopyButtons() {
document.querySelectorAll('pre code').forEach(function(codeBlock) {
if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;
codeBlock.parentElement.setAttribute('data-copy-added', 'true');
var btn = document.createElement('button');
btn.textContent = 'Copy';
btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';
btn.onmouseover = function() { this.style.opacity = '1'; };
btn.onmouseout = function() { this.style.opacity = '0.7'; };
btn.onclick = function() {
navigator.clipboard.writeText(codeBlock.textContent).then(function() {
btn.textContent = 'Copied!';
setTimeout(function() { btn.textContent = 'Copy'; }, 1500);
});
};
codeBlock.parentElement.style.position = 'relative';
codeBlock.parentElement.appendChild(btn);
});
}
addCopyButtons();
// Re-run on dynamic content
var observer = new MutationObserver(addCopyButtons);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Bust the assets cache on modification. by T4rk1n · Pull Request #309 · plotly/dash · GitHub
Skip to content

Bust the assets cache on modification. - #309

Merged
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache
Aug 10, 2018
Merged

Bust the assets cache on modification.#309
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Jul 31, 2018

Copy link
Copy Markdown
Contributor

Append time modified as query string to assets urls to trick the cache to refresh the file.

cc @plotly/dash

Resolves#303

@rmarren1

Copy link
Copy Markdown
Contributor

I like this, annoying to always have dev tools open and the cache probably trips up beginners.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While this will work when developing locally, assets will still be cached by the browser when the user deploys the app. The use case I'm imagining is:

  1. Developer deploys their app
  2. Person A visits their app
  3. Developer changes CSS, deploys again
  4. Person A visits again - the CSS is cached from when they visited the app before the previous deploy.

The developer won't see an issue because they got the new version when they were developing, so they might not even know that their visitors will have an issue.

So, I think we should append a time modified query string or some other solution

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 090e0fd to 35a4bb0CompareJuly 31, 2018 21:55
@T4rk1nT4rk1n changed the title Disable the cache if debug=True.Bust the assets cache on modification.Jul 31, 2018
@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp I changed this PR to use time modified query string.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome, thanks for updating this! Once this is released, could you update https://github.com/plotly/dash-docs/blob/master/tutorial/external_css_and_js.py#L160-L163?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp Ok, I'll release this along with #305 tomorrow.

@chriddyp

Copy link
Copy Markdown
Member

@T4rk1n - Could we get this one merged and released?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp
Sorry I thought @bpostlethwaite wanted to chime in, we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings.

@chriddyp

Copy link
Copy Markdown
Member

we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings

OK. Why? It seems to complicate things to have two different ways that caches are invalidated in local vs deployed. Also, we don't have the config abstraction around local vs production yet.

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

That is also my feeling, I'll merge & release.

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 35a4bb0 to 67f8601CompareAugust 10, 2018 20:25
@T4rk1n
T4rk1n merged commit 7d847c6 into masterAug 10, 2018
@T4rk1n
T4rk1n deleted the dev-mode-disable-cache branch August 10, 2018 21:04
HammadTheOne pushed a commit to HammadTheOne/dash that referenced this pull request May 28, 2021
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@T4rk1n@rmarren1@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { // Force GitHub README to respect dark mode (function() { var style = document.createElement('style'); style.textContent = ' .markdown-body { color-scheme: dark light; } .markdown-body pre { background: #161b22 !important; } .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; } .markdown-body table th, .markdown-body table td { border-color: #30363d !important; } .markdown-body img { background: #0d1117; } .markdown-body blockquote { border-left-color: #8b949e; } .markdown-body hr { border-color: #30363d; } '; document.head.appendChild(style); })(); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' Bust the assets cache on modification. by T4rk1n · Pull Request #309 · plotly/dash · GitHub
Skip to content

Bust the assets cache on modification. - #309

Merged
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache
Aug 10, 2018
Merged

Bust the assets cache on modification.#309
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Jul 31, 2018

Copy link
Copy Markdown
Contributor

Append time modified as query string to assets urls to trick the cache to refresh the file.

cc @plotly/dash

Resolves#303

@rmarren1

Copy link
Copy Markdown
Contributor

I like this, annoying to always have dev tools open and the cache probably trips up beginners.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While this will work when developing locally, assets will still be cached by the browser when the user deploys the app. The use case I'm imagining is:

  1. Developer deploys their app
  2. Person A visits their app
  3. Developer changes CSS, deploys again
  4. Person A visits again - the CSS is cached from when they visited the app before the previous deploy.

The developer won't see an issue because they got the new version when they were developing, so they might not even know that their visitors will have an issue.

So, I think we should append a time modified query string or some other solution

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 090e0fd to 35a4bb0CompareJuly 31, 2018 21:55
@T4rk1nT4rk1n changed the title Disable the cache if debug=True.Bust the assets cache on modification.Jul 31, 2018
@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp I changed this PR to use time modified query string.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome, thanks for updating this! Once this is released, could you update https://github.com/plotly/dash-docs/blob/master/tutorial/external_css_and_js.py#L160-L163?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp Ok, I'll release this along with #305 tomorrow.

@chriddyp

Copy link
Copy Markdown
Member

@T4rk1n - Could we get this one merged and released?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp
Sorry I thought @bpostlethwaite wanted to chime in, we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings.

@chriddyp

Copy link
Copy Markdown
Member

we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings

OK. Why? It seems to complicate things to have two different ways that caches are invalidated in local vs deployed. Also, we don't have the config abstraction around local vs production yet.

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

That is also my feeling, I'll merge & release.

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 35a4bb0 to 67f8601CompareAugust 10, 2018 20:25
@T4rk1n
T4rk1n merged commit 7d847c6 into masterAug 10, 2018
@T4rk1n
T4rk1n deleted the dev-mode-disable-cache branch August 10, 2018 21:04
HammadTheOne pushed a commit to HammadTheOne/dash that referenced this pull request May 28, 2021
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@T4rk1n@rmarren1@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { // Highlight search terms from Google/DuckDuckGo/Bing referrer (function() { var ref = document.referrer; var terms = []; if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) { var url = new URL(ref); var q = url.searchParams.get('q') || url.searchParams.get('p'); if (q) { terms = q.split(/\s+/).filter(function(t) { return t.length > 2; }); } } if (terms.length === 0) return; var style = document.createElement('style'); style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }'; document.head.appendChild(style); function highlight(node) { if (node.nodeType === 3) { // text node var text = node.textContent; var found = false; terms.forEach(function(term) { var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\]\\]/g, '\\') + ')', 'gi'); if (regex.test(text)) { found = true; var frag = document.createDocumentFragment(); var parts = text.split(regex); parts.forEach(function(part, i) { if (i % 2 === 0) { frag.appendChild(document.createTextNode(part)); } else { var span = document.createElement('span'); span.className = 'userscript-highlight'; span.textContent = part; frag.appendChild(span); } }); node.parentNode.replaceChild(frag, node); } }); } else if (node.nodeType === 1 && node.childNodes) { // element var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT']; if (!skipTags.includes(node.tagName)) { Array.from(node.childNodes).forEach(highlight); } } } highlight(document.body); // Re-highlight on dynamic content var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1 || node.nodeType === 3) highlight(node); }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' Bust the assets cache on modification. by T4rk1n · Pull Request #309 · plotly/dash · GitHub
Skip to content

Bust the assets cache on modification. - #309

Merged
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache
Aug 10, 2018
Merged

Bust the assets cache on modification.#309
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Jul 31, 2018

Copy link
Copy Markdown
Contributor

Append time modified as query string to assets urls to trick the cache to refresh the file.

cc @plotly/dash

Resolves#303

@rmarren1

Copy link
Copy Markdown
Contributor

I like this, annoying to always have dev tools open and the cache probably trips up beginners.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While this will work when developing locally, assets will still be cached by the browser when the user deploys the app. The use case I'm imagining is:

  1. Developer deploys their app
  2. Person A visits their app
  3. Developer changes CSS, deploys again
  4. Person A visits again - the CSS is cached from when they visited the app before the previous deploy.

The developer won't see an issue because they got the new version when they were developing, so they might not even know that their visitors will have an issue.

So, I think we should append a time modified query string or some other solution

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 090e0fd to 35a4bb0CompareJuly 31, 2018 21:55
@T4rk1nT4rk1n changed the title Disable the cache if debug=True.Bust the assets cache on modification.Jul 31, 2018
@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp I changed this PR to use time modified query string.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome, thanks for updating this! Once this is released, could you update https://github.com/plotly/dash-docs/blob/master/tutorial/external_css_and_js.py#L160-L163?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp Ok, I'll release this along with #305 tomorrow.

@chriddyp

Copy link
Copy Markdown
Member

@T4rk1n - Could we get this one merged and released?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp
Sorry I thought @bpostlethwaite wanted to chime in, we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings.

@chriddyp

Copy link
Copy Markdown
Member

we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings

OK. Why? It seems to complicate things to have two different ways that caches are invalidated in local vs deployed. Also, we don't have the config abstraction around local vs production yet.

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

That is also my feeling, I'll merge & release.

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 35a4bb0 to 67f8601CompareAugust 10, 2018 20:25
@T4rk1n
T4rk1n merged commit 7d847c6 into masterAug 10, 2018
@T4rk1n
T4rk1n deleted the dev-mode-disable-cache branch August 10, 2018 21:04
HammadTheOne pushed a commit to HammadTheOne/dash that referenced this pull request May 28, 2021
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@T4rk1n@rmarren1@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { // Strip utm_, fbclid, gclid, etc. from all links on page (function() { var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content', 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid', 'ref', 'ref_src', 'source', 'medium', 'campaign']; function cleanUrl(url) { try { var u = new URL(url, window.location.origin); var changed = false; trackingParams.forEach(function(p) { if (u.searchParams.has(p)) { u.searchParams.delete(p); changed = true; } }); return changed ? u.toString() : url; } catch (e) { return url; } } function cleanLinks() { document.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } cleanLinks(); var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1) { if (node.tagName === 'A') cleanLinks(); node.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + ' Bust the assets cache on modification. by T4rk1n · Pull Request #309 · plotly/dash · GitHub
Skip to content

Bust the assets cache on modification. - #309

Merged
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache
Aug 10, 2018
Merged

Bust the assets cache on modification.#309
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Jul 31, 2018

Copy link
Copy Markdown
Contributor

Append time modified as query string to assets urls to trick the cache to refresh the file.

cc @plotly/dash

Resolves#303

@rmarren1

Copy link
Copy Markdown
Contributor

I like this, annoying to always have dev tools open and the cache probably trips up beginners.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While this will work when developing locally, assets will still be cached by the browser when the user deploys the app. The use case I'm imagining is:

  1. Developer deploys their app
  2. Person A visits their app
  3. Developer changes CSS, deploys again
  4. Person A visits again - the CSS is cached from when they visited the app before the previous deploy.

The developer won't see an issue because they got the new version when they were developing, so they might not even know that their visitors will have an issue.

So, I think we should append a time modified query string or some other solution

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 090e0fd to 35a4bb0CompareJuly 31, 2018 21:55
@T4rk1nT4rk1n changed the title Disable the cache if debug=True.Bust the assets cache on modification.Jul 31, 2018
@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp I changed this PR to use time modified query string.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome, thanks for updating this! Once this is released, could you update https://github.com/plotly/dash-docs/blob/master/tutorial/external_css_and_js.py#L160-L163?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp Ok, I'll release this along with #305 tomorrow.

@chriddyp

Copy link
Copy Markdown
Member

@T4rk1n - Could we get this one merged and released?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp
Sorry I thought @bpostlethwaite wanted to chime in, we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings.

@chriddyp

Copy link
Copy Markdown
Member

we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings

OK. Why? It seems to complicate things to have two different ways that caches are invalidated in local vs deployed. Also, we don't have the config abstraction around local vs production yet.

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

That is also my feeling, I'll merge & release.

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 35a4bb0 to 67f8601CompareAugust 10, 2018 20:25
@T4rk1n
T4rk1n merged commit 7d847c6 into masterAug 10, 2018
@T4rk1n
T4rk1n deleted the dev-mode-disable-cache branch August 10, 2018 21:04
HammadTheOne pushed a commit to HammadTheOne/dash that referenced this pull request May 28, 2021
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@T4rk1n@rmarren1@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { // Auto-enable theater mode on YouTube (function() { function tryTheater() { var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]'); if (btn && !btn.classList.contains('activated')) { btn.click(); } } // Try immediately tryTheater(); // Try after navigation (SPA) var lastUrl = location.href; setInterval(function() { if (location.href !== lastUrl) { lastUrl = location.href; setTimeout(tryTheater, 500); } }, 1000); // Also try on player load var observer = new MutationObserver(tryTheater); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' Bust the assets cache on modification. by T4rk1n · Pull Request #309 · plotly/dash · GitHub
Skip to content

Bust the assets cache on modification. - #309

Merged
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache
Aug 10, 2018
Merged

Bust the assets cache on modification.#309
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Jul 31, 2018

Copy link
Copy Markdown
Contributor

Append time modified as query string to assets urls to trick the cache to refresh the file.

cc @plotly/dash

Resolves#303

@rmarren1

Copy link
Copy Markdown
Contributor

I like this, annoying to always have dev tools open and the cache probably trips up beginners.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While this will work when developing locally, assets will still be cached by the browser when the user deploys the app. The use case I'm imagining is:

  1. Developer deploys their app
  2. Person A visits their app
  3. Developer changes CSS, deploys again
  4. Person A visits again - the CSS is cached from when they visited the app before the previous deploy.

The developer won't see an issue because they got the new version when they were developing, so they might not even know that their visitors will have an issue.

So, I think we should append a time modified query string or some other solution

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 090e0fd to 35a4bb0CompareJuly 31, 2018 21:55
@T4rk1nT4rk1n changed the title Disable the cache if debug=True.Bust the assets cache on modification.Jul 31, 2018
@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp I changed this PR to use time modified query string.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome, thanks for updating this! Once this is released, could you update https://github.com/plotly/dash-docs/blob/master/tutorial/external_css_and_js.py#L160-L163?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp Ok, I'll release this along with #305 tomorrow.

@chriddyp

Copy link
Copy Markdown
Member

@T4rk1n - Could we get this one merged and released?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp
Sorry I thought @bpostlethwaite wanted to chime in, we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings.

@chriddyp

Copy link
Copy Markdown
Member

we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings

OK. Why? It seems to complicate things to have two different ways that caches are invalidated in local vs deployed. Also, we don't have the config abstraction around local vs production yet.

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

That is also my feeling, I'll merge & release.

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 35a4bb0 to 67f8601CompareAugust 10, 2018 20:25
@T4rk1n
T4rk1n merged commit 7d847c6 into masterAug 10, 2018
@T4rk1n
T4rk1n deleted the dev-mode-disable-cache branch August 10, 2018 21:04
HammadTheOne pushed a commit to HammadTheOne/dash that referenced this pull request May 28, 2021
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@T4rk1n@rmarren1@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { // Remove or un-stick sticky/fixed headers that block content (function() { function unstick() { document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) { if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') { el.style.position = 'static'; el.style.top = 'auto'; el.style.zIndex = 'auto'; } }); } unstick(); var observer = new MutationObserver(unstick); observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] }); })(); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' Bust the assets cache on modification. by T4rk1n · Pull Request #309 · plotly/dash · GitHub
Skip to content

Bust the assets cache on modification. - #309

Merged
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache
Aug 10, 2018
Merged

Bust the assets cache on modification.#309
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Jul 31, 2018

Copy link
Copy Markdown
Contributor

Append time modified as query string to assets urls to trick the cache to refresh the file.

cc @plotly/dash

Resolves#303

@rmarren1

Copy link
Copy Markdown
Contributor

I like this, annoying to always have dev tools open and the cache probably trips up beginners.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While this will work when developing locally, assets will still be cached by the browser when the user deploys the app. The use case I'm imagining is:

  1. Developer deploys their app
  2. Person A visits their app
  3. Developer changes CSS, deploys again
  4. Person A visits again - the CSS is cached from when they visited the app before the previous deploy.

The developer won't see an issue because they got the new version when they were developing, so they might not even know that their visitors will have an issue.

So, I think we should append a time modified query string or some other solution

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 090e0fd to 35a4bb0CompareJuly 31, 2018 21:55
@T4rk1nT4rk1n changed the title Disable the cache if debug=True.Bust the assets cache on modification.Jul 31, 2018
@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp I changed this PR to use time modified query string.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome, thanks for updating this! Once this is released, could you update https://github.com/plotly/dash-docs/blob/master/tutorial/external_css_and_js.py#L160-L163?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp Ok, I'll release this along with #305 tomorrow.

@chriddyp

Copy link
Copy Markdown
Member

@T4rk1n - Could we get this one merged and released?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp
Sorry I thought @bpostlethwaite wanted to chime in, we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings.

@chriddyp

Copy link
Copy Markdown
Member

we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings

OK. Why? It seems to complicate things to have two different ways that caches are invalidated in local vs deployed. Also, we don't have the config abstraction around local vs production yet.

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

That is also my feeling, I'll merge & release.

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 35a4bb0 to 67f8601CompareAugust 10, 2018 20:25
@T4rk1n
T4rk1n merged commit 7d847c6 into masterAug 10, 2018
@T4rk1n
T4rk1n deleted the dev-mode-disable-cache branch August 10, 2018 21:04
HammadTheOne pushed a commit to HammadTheOne/dash that referenced this pull request May 28, 2021
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@T4rk1n@rmarren1@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { // Universal Dark Mode - works on any site (function() { var enabled = true; function applyDarkMode() { if (!enabled) return; // Create style element if it doesn't exist var style = document.getElementById('universal-dark-mode-style'); if (!style) { style = document.createElement('style'); style.id = 'universal-dark-mode-style'; document.head.appendChild(style); } // Dark mode CSS - inverts colors but preserves images/video style.textContent = ' /* Invert everything except media */ html { filter: invert(1) hue-rotate(180deg) !important; background: #1a1a2e !important; } /* Restore images, videos, iframes, canvas */ img, video, iframe, canvas, svg, picture, [style*="background-image"] { filter: invert(1) hue-rotate(180deg) !important; } /* Preserve specific elements that should not be inverted */ .no-dark-mode, .no-dark-mode *, [data-theme="light"], [data-theme="light"], .ace_editor, .ace_editor *, .CodeMirror, .CodeMirror *, .monaco-editor, .monaco-editor *, .markdown-body pre, .markdown-body pre *, .highlight, .highlight *, pre code, pre code * { filter: none !important; } /* Fix common UI elements */ .modal, .popup, .dropdown-menu, .tooltip, .popover { filter: invert(1) hue-rotate(180deg) !important; background: #2d2d44 !important; border-color: #444 !important; } /* Scrollbars */ ::-webkit-scrollbar { background: #1a1a2e !important; } ::-webkit-scrollbar-thumb { background: #444 !important; } ::-webkit-scrollbar-thumb:hover { background: #555 !important; } /* Selection */ ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; } ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; } '; } function removeDarkMode() { var style = document.getElementById('universal-dark-mode-style'); if (style) style.remove(); } // Toggle with Alt+Shift+D document.addEventListener('keydown', function(e) { if (e.altKey && e.shiftKey && e.key === 'D') { e.preventDefault(); enabled = !enabled; if (enabled) { applyDarkMode(); console.log('[Universal Dark Mode] Enabled'); } else { removeDarkMode(); console.log('[Universal Dark Mode] Disabled'); } } }); // Apply on load applyDarkMode(); // Re-apply on dynamic content var observer = new MutationObserver(function(mutations) { if (enabled && !document.getElementById('universal-dark-mode-style')) { applyDarkMode(); } }); observer.observe(document.head, { childList: true }); console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle'); })(); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })(); Bust the assets cache on modification. by T4rk1n · Pull Request #309 · plotly/dash · GitHub
Skip to content

Bust the assets cache on modification. - #309

Merged
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache
Aug 10, 2018
Merged

Bust the assets cache on modification.#309
T4rk1n merged 2 commits into
masterfrom
dev-mode-disable-cache

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Jul 31, 2018

Copy link
Copy Markdown
Contributor

Append time modified as query string to assets urls to trick the cache to refresh the file.

cc @plotly/dash

Resolves#303

@rmarren1

Copy link
Copy Markdown
Contributor

I like this, annoying to always have dev tools open and the cache probably trips up beginners.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While this will work when developing locally, assets will still be cached by the browser when the user deploys the app. The use case I'm imagining is:

  1. Developer deploys their app
  2. Person A visits their app
  3. Developer changes CSS, deploys again
  4. Person A visits again - the CSS is cached from when they visited the app before the previous deploy.

The developer won't see an issue because they got the new version when they were developing, so they might not even know that their visitors will have an issue.

So, I think we should append a time modified query string or some other solution

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 090e0fd to 35a4bb0CompareJuly 31, 2018 21:55
@T4rk1nT4rk1n changed the title Disable the cache if debug=True.Bust the assets cache on modification.Jul 31, 2018
@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp I changed this PR to use time modified query string.

@chriddypchriddyp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome, thanks for updating this! Once this is released, could you update https://github.com/plotly/dash-docs/blob/master/tutorial/external_css_and_js.py#L160-L163?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp Ok, I'll release this along with #305 tomorrow.

@chriddyp

Copy link
Copy Markdown
Member

@T4rk1n - Could we get this one merged and released?

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@chriddyp
Sorry I thought @bpostlethwaite wanted to chime in, we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings.

@chriddyp

Copy link
Copy Markdown
Member

we discussed that in local, we shouldn't add the modified query string for the assets to be mapped to the right local file and instead use the no-cache while on local and use the query string only in a prod settings

OK. Why? It seems to complicate things to have two different ways that caches are invalidated in local vs deployed. Also, we don't have the config abstraction around local vs production yet.

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

That is also my feeling, I'll merge & release.

@T4rk1n
T4rk1nforce-pushed the dev-mode-disable-cache branch from 35a4bb0 to 67f8601CompareAugust 10, 2018 20:25
@T4rk1n
T4rk1n merged commit 7d847c6 into masterAug 10, 2018
@T4rk1n
T4rk1n deleted the dev-mode-disable-cache branch August 10, 2018 21:04
HammadTheOne pushed a commit to HammadTheOne/dash that referenced this pull request May 28, 2021
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@T4rk1n@rmarren1@chriddyp