我今年17岁，现在几个月以来，我一直在复制Habr移动应用程序，称其为适当，时尚，具有风格和结尾处自tent的点-habra。原来，它实现了一些功能，这些功能在游戏市场的官方应用程序或网站本身中尚不可用。
最不耐烦的Web应用程序链接是habra.js.org。所有其余的-请在猫之下。
一切如何开始
还记得有这样的一个应用程序供Android阅读Habrahabr吗？似乎是官方的，来自网站创建者本人，但最近一次更新是在2019年。一切都很好-从一个黑暗的主题开始，以离线模式结束，在这种模式下，您无需回家就可以在没有互联网的情况下阅读文章。但是这个世界并不像我们所希望的那样理想，命运的最后一次更新杀死了，不，它杀死了一个很酷的应用程序：加载不足的图片开始出现和消失，导致文章的文字抽搐。按照2019年的标准，设计不再是小菜一碟。
如果您最喜欢的应用程序没有更新，但是您想要新的芯片，该怎么办？没错，请使用二十一点，炫酷功能和深色主题。
薯条
首先，也是最重要的是主题。
— , (), OLED . , , ?
475ms , ( — 1 207ms):
- ? , , . i7-7700K:
DevTools, , , 16 , i7! . :
, 16 user input.
PWA PWA, service-worker, . API .
const whitelist = ['https://m.habr']
const CACHE_LIFETIME = 3600 * 1000
self.addEventListener('fetch', (event) => {
return event.respondWith(
(async () => {
const isOffline = !navigator.onLine
// Do not cache requests that are not in whitelist
if (!whitelist.some((e) => event.request.url.startsWith(e)))
return fetch(event.request)
// Try to get the response from a cache
const cachedResponse = await caches.match(event.request)
// Return it if we found one and we don't have connection
if (cachedResponse && isOffline) return cachedResponse
// If we didn't find a match in the cache, use the network
const response = await fetch(event.request)
if (response.status < 400) {
try {
const responseClone = response.clone()
const cacheStore = await caches.open('v1')
cacheStore
.put(event.request, responseClone)
.catch((e) =>
console.warn('Cannot put a request to the cache:', e.message)
)
} catch (e) {
console.warn('Cannot put a request to the cache:', e.message)
}
}
return response
})()
)
}), ! , - . , .
, , ( , )
… issues, . 70% — , , , .. ( , ), . , , , .
. , -. Material-UI , "-".
Github Pages , , 404. , service worker .
. - . , , . -, , . - , csrf-token , git/issues/22. , API . .
. . .
可以说，我在这个项目的前端宣称自己。因此，先生们阅读，我把它拆开并加以批评。作为一个没有自尊心的孩子，我需要她在晚上（或者不晚上）在聊天室里吹牛。提前致谢！
链接
Github：jarvis394 / habra网站
本身：habra.js.org
UPD：如果Habr的某人暗示如何处理授权，那将非常酷。很多人需要：P
csrf, . , .
